분류 전체보기 337

변수와 상수[var,let,const 및 호이스팅,스코프]

1 ) 변수 선언 방식 var : 중복 선언과 재할당이 가능하다. - 아래와 같이 중복 선언과 재할당이 가능하며 마지막에 할당된 값이 변수에 저장된다. - 자율성은 생기지만 소스 코드가 복잡해질 경우 기존 선언해둔 변수를 잊고 다시 선언하거나 재할당을 해서 어떤 부분에서 값이 변경되는지 파악하기 힘들어 지게 된다. 그래서 let과 const가 생긴 이후 var는 사용하지 않는다. var greeting = 'hello'; console.log(greeting); var greeting = 'hi'; console.log(greeting); greeting = 'how are you?'; console.log(greeting); let(ES6) : 중복 선언은 불가하며, 재할당은 가능하다. let gree..

자바스크립트(JavaScript)란 ?

2021년도 최대 프로그래밍 커뮤니티인 Stack Overflow에서 가장 인기 있는 프로그래밍 언어로 1등으로 선정되었다. 자바스크립트는 HTML과 CSS와 더불어 웹을 개발하는 3가지 언어 중 하나이다. 각 언어의 역활을 간단하게 정리해 보자 1. HTML : 요소들의 배치와 내용을 기술 2. CSS : 색, 크기, 애니메이션 등을 정의하는 스타일리을 위한 언어 3. JavaScript : 웹 사이트에 활력을 부여하는 언어 자바스크립트 엔진(JIT Compiliation) 자바스크립트는 자바스크립트 엔진이 실행을 하게 되며 주로 웹 브라우저(사바리,엣지,크롬,파이어폭스)등에 포함이 되어 있다. (가장 대표적으로 구글 크롬의 V8엔진이 있다.) 즉, 자바스크립트 엔진을 내장한 웹브라우저는 자바스크립트가..

서버 원격 깃허브에서 main에 있는거 한방에 pull로 당겨오기

sudo git fetch —all // 원격 저장소에서 모든 변경 사항을 가져오기sudo git reset —hard origin/main //로컬 저장소의 HEAD를 원격 저장소의 main 브랜치로 재설정sudo git pull //원격 저장소의 변경 사항을 로컬 저장소로 가져오고 병합주로 다른 개발자가 main 브랜치에 변경 사항을 커밋하면 sudo git fetch --all을 사용하여 해당 변경 사항을 로컬 저장소로 가져온다.그런 다음 sudo git reset --hard origin/main을 사용하여 로컬 저장소의 HEAD를 원격 저장소의 main 브랜치로 재설정 한다.이렇게 하면 로컬 저장소의 변경 사항이 모두 삭제되고 원격 저장소의 main 브랜치의 변경 사항만 남게 된다. 마지..

이슈에 대한 대처 양식

프로젝트를 통해서 최소 하나 얻어갈 인사이트를 기록1.issue  2.problem3.solution4.what i learn    예시 1 1.issue 사용자들이 에러를 직면한 이슈가 발생배포한 서버를 업데이트 하기 위해서 코드를 수정하는 작업을 하는 동안 사용자들이 에러를 직면하는 이슈가 발생했다. 2.problem스테이지 단계와 프로덕션 단계의 서버를 나누어 놓지 않는게 원인 3.solution단일 서버에서 배포단계를 나워서 설계해서 개선원래 프로젝트는 단일 서버로만 진행했었던 것을 배포단계로 나눠서 설계함 4.what i learn내가 이런 상황에 놓였을 때 프로덕션 서버 하나로 위와 같은 이벤트로 알게 되었다.   예시 21.issue 특정 API 에서 응답 수집 시간이 200% 딜레이 되는 ..

모카 로깅 2024.02.29

프론트엔드 CORS 개념 정리

프론트 개발을 하던 중 만들고 있는 웹사이트에서 외부 API에서 정보를 받아 오려고 할때 주로 발생한다. 즉, 한 사이트에서 주소가 다른 서버로 요청을 보낼 때 발생 Postman이나 다른 익스텐션 어플로 테스트를 하면 이상이 없지만 웹사이트(브라우저)에서의 요청에서는 CORS 에러가 나온다. 해당 하는 서버에서 요청을 막는 것이 아니라 브라우저(크롬) 쪽에서 연결을 막는 것이다. 주로 브라우저에서 접속하는 사이트 들은 당연하게도 되부 사이트여서 의심을 하는것이다. 즉, 브라우저는 사용자가 방문한 사이트에 대해 믿지 못해서 발생한다. 그럼 CORS가 있는 이유는 ? 주로 브라우저에서 사이트를 이용할 때 나의 브라우저의 쿠키로 사용자의 정보가 있다(토큰이나 세션 정보) 이러한 상황에서 악성사이트에 방문할..

Node 버전 변경해서 사용하기 (nvx)

깃헙에 있는 다른 프로젝트들과 오픈소스를 돌려 보던 와중  프로젝트 마다  node 버전이 달라 종속성이 꼬여 에러가 발생 하였다. 매번 참조 할 때마다 노드를 삭제 하였다가 해당 프로젝트의 node버전으로 다운을 받아도 되지만 그러면 시간이 오래 걸리고 매우 번거롭다. 이럴 경우 NVX라느 node.js 버전 관리 도구를 사용해서 빠르게 버전을 변경할 수 있다. + nvx의 경우 npm을 설치할 경우 자동으로 전역적으로 설치가 된다. 에러 코드> npm run start> dwitter-app@0.1.0 start> react-scripts startnode:internal/modules/cjs/loader:573 throw e; ^Error [ERR_PACKAGE_PATH_NOT_E..

4회차 회원가입, 로그인 기능 추가

학습 목표 JWT에 대한 이해 JWT를 활용한 인증, 인가 구현 로그인, 회원가입 로직 이해 1. 회원가입 기능 회원가입 시 이메일, 패스워드를 받아서, DB에 이메일, 패스워드, 회원 가입 시간을 저장해야 한다. 유저에 대한 정보가 저장될 때, id(PK, primary key)도 같이 Auto-increment 형식으로 저장돼야 한다. 이메일에 반드시 @가 1개만 포함되어 있어야 한다. 이메일에 공백이 포함될 수 없다. 중복된 이메일이 존재할 수 없다. 패스워드에 공백이 포함될 수 없다. 패스워드는 8자 이상 15자 이하여야 한다. (비밀번호는 암호화하지 않고 그대로 저장한다. 암호화하는 건 뒤에서 구현하게 된다.) 2. 로그인 기능 로그인 시 이메일, 패스워드 값을 받는다. 로그인에 성공했을 때, ..

3회차 API 서버 배포[ CORS세팅,에러처리]

학습 목표 환경 변수 분리 CORS 셋팅 예상치 못한 에러에 대한 처리 AWS의 Elastic Beanstalk를 활용한 서비스 배포 ✅ 요구 사항 환경 변수를 분리해라. 로컬 환경, 배포 환경 2가지로 환경 변수를 분리해라. Node.js에서는 .env를 활용해라. Spring Boot에서는 application.yml(또는 application.properties)를 활용해라. CORS를 설정해라. 예상치 못한 에러에 대해, 상태 코드 500과 에러 메시지로 응답하는 전역 예외 처리 설정을 해줘라. Express.js : https://expressjs.com/ko/guide/error-handling.html Nest.js : https://docs.nestjs.com/exception-filter..

2회차 익명 게시판 서비스 [에러 및 부족한 개념 채우기]

1. port: +process.env.PORT 에서 환경 변수 안되는데 질문 process.env.PORT 3306 에서 string 형식은 number형식에 할당할수 없다는에러. => 1. const port = parseInt(process.env.PORT, 10); // 10진수로 파싱하여 숫자로 변환 2. const port = +process.env.PORT; 2. 컨트롤러 구성시 Get이 먼저 나와야 하는 이유 NestJS의 데코레이터(decorator)의 우선순위는 라우팅 매칭과 미들웨어 실행에 영향을 미친다. NestJS는 데코레이터의 우선순위를 기준으로 요청을 올바른 핸들러 함수로 라우팅하고, 미들웨어를 실행한다. 경로 매칭 우선순위: NestJS에서 경로 매칭은 가장 구체적인 경로와 ..

2회차 익명 게시판 서비스 [API문서 Swagger 만들기]

LEVLE 5 협업의 기본, API 문서 만들기! 학습 목표 API 문서 작성 ✅ 요구 사항 아래 API에 대해 API 문서를 작성해라. 게시글 작성 기능 게시글 전체 조회 기능 특정 게시글 조회 기능 특정 게시글 수정 기능 특정 게시글 삭제 기능 게시글 검색 기능 ✅ 제약 조건 Swagger, Github Wiki, Notion, Postman, Gitbook 중 사용하기 API 문서에 아래의 내용은 반드시 포함시키기 URL 주소 / HTTP 메서드 API 설명 요청 형태 Path Parmas Query Params Body Params 필수 여부 데이터 타입 응답 형태 응답 코드(status code) 각 응답 코드별 설명 응답 형태 (response value) 응답 값에서 각 파라미터의 의미 응답..