바텐더에서 개발자로 바텐더에서 개발자로

I. 카카오 애플리케이션 설정 먼저 카카오 로그인이다. 카카오 로그인을 구현하기 위해서는 카카오 디벨로퍼에 들어가서 내 애플리케이션을 만들고, 자신의 프로젝트에 맞게 설정해야 한다. 1. 아래와 같이 '내 애플리케이션' 에 들어간다. 2. '애플리케이션 추가하기' 를 누르고, 아래의 창이 나타나면 알맞게 입력하면 된다. 3. 추가한 애플리케이션을 눌러보면 아래와 같은 화면이 나타난다. 이 때, 'REST API키' 가 'KAKAO_CLIENT_ID' 가 될 것이니 잘 봐두자. 4. 이제 redirect_uri를 설정해보자. - 좌측의 '카카오 로그인' 클릭. - 'Redirect URI 등록' 클릭 - 클라이언트쪽에서 사용하고, 서버로 보내줄 redirect_uri 를 등록해주자. 5. 카카오서버를 통해..

I. 소셜 로그인 플로우 이번에 소셜 로그인을 구현하면서 느낀 것은, 서버에서만 할 수 있는 일은 한계가 있다. 괜히 클라이언트와 서버가 나뉘어 있는 것이 아니다. 처음엔 카카오 로그인의 기능을 전부 서버쪽에서 작업을 했었는데, 그렇게 되면 Request Body 값을 받을 때와, 특히 테스트를 진행할 때 정말 어려움을 겪었다. 따라서, 이번 포스팅은 느낀 점을 바탕으로 소셜 로그인에 대해서 적어볼까 한다. 먼저 소셜 로그인의 플로우는 아래와 같다. 카카오 로그인으로 예를 들겠다.(다른 소셜들도 똑같은 플로우) 내가 직접 그린 플로우다. 이걸 읽어보는 분들도 구현하면서 꼭 3번 이상 그려보는 것을 추천한다. 뇌로만 플로우를 '이해' 하는 것과, '그림'을 직접 그려보는 것은 확연한 차이가 있을 것이다. ..

1. Nestjs 란? Nestjs 란, 자바스크립트나 타입스크립트로 서버 애플리케이션을 개발할 수 있는 백엔드 웹 프레임 워크이다. 이전 학원을 다녔을 때 Java 개발자 양성과정을 수료했었는데, Java 가 더 친숙하신 분들을 위해 예를 들자면, Java 의 Spring 과 같은 개념이다. 현 프로젝트를 진행하면서 Nestjs 라는 프레임워크를 새롭게 접하게 되었는데, 새롭게 알게 된 사실들을 Nestjs 카테고리에 정리할 예정이다. Nestjs 는 Spring 과 비슷하게 MVC 패턴을 띄고있다. MVC 패턴을 '띄고' 있다는 것이지, '완벽한 MVC 패턴이다' 라고 말할 수는 없다. Nestjs 는 Controller, Provider, Module 로 이루어져 있다. Controller - 백엔..

I. 타입스크립트 추가 문법 1. es모듈 사용하기 // node.ts import fs from 'fs'; fs.readFile('package.json'); 첫 번째 코드를 npx tsc --noEmit 으로 실행하면 두 번째 사진과 같은 에러가 발생한다. fs 모듈의 타입 정의를 찾을 수 없다는 의미인데, 노드의 타입은 따로 설치해야 사용할 수 있다. - npm i -D @types/node 명령어를 사용하여 @types/node 패키지를 설치하면 된다. @types/node 설치 후, 다시 npx tsc --noEmit 으로 실행하면 위와 같은 에러가 발생한다. 이제부터 해결을 해보자. ✨ VSCode 기준으로, 메서드나 모듈 등의 위에서 f12 를 누르면 해당 메서드, 모듈의 상세한 설정파일 창..

I. 타입스크립트 문법 1. 타입스크립트는 변수, 매개변수, 리턴값에 타입을 붙인 언어 let a: boolean = true;// 원시자료형 const b: { hello:string } = { hello: 'world' };// 객체 function add(x: number, y: number): number { return x + y };// 함수 const minus = (x: number, y: number): number => x - y;// 화살표함수 - 명시적으로 타입을 적을 때, 대문자로 적으면 안됨 (ex) Boolean, BOOLEAN - X) - 타입스크립트를 처음 접하는 사람들의 경우 가독성이 조금 떨어지는 코드가 될 수 있으니, 헷갈린다면 :type 을 빼고 보기 ✨ 타입 에일리..

I. 타입스크립트란? 1. 자바스크립트에 명시적으로 타입이 추가된 언어 - 자바스크립트에도 타입은 있다. 문자열, 숫자, 불 값, 객체 같은 자료형 타입이다. 그저 자바스크립트 코드를 작성할 때 명시적으로 타입을 지정하지 않았을 뿐이다. 자바스크립트 코드를 작성할 때도 어느정도 타입에 대한 개념을 갖고 코드를 작성하므로 타입스크립트 코드가 많이 생소하지는 않을 것이다. 2. tsc - 타입스크립트 코드는 tsc 라는 컴파일러를 통해 자바스크립트 코드로 변환할 수 있다. 노드는 자바스크립트 런타임이므로, 타입스크립트 => 자바스크립트 를 해야만 실행이 가능하다. - npm i typescript : tsc 컴파일러 다운로드 명령어 - type 검사 + 자바스크립트 변환 3. 디노(deno) : 타입스크립트..

I. 관계 쿼리 1. 결과값이 자바스크립트 객체 const user = await User.findOne({}); // 한명만 가져올 때 : findOne({}) // 모두 가져올 때 : findAll({}) console.log(user.nickname);// 사용자 닉네임 2. include로 JOIN 과 비슷한 기능 수행 가능(관계 있는 것 엮을 수 있음) const user = await User.fineOne({ include: [{ model: Comment,// 사용자(User) 가져오면서 Comment까지 가져옴 }] }); console.log(user.Comments); // hasOne 은 Comment(단수형) // hasMany 는 Commments(복수형) - 시퀄라이즈가 has..

I. 1 : N 관계 정의하기 1. users(사용자) 모델과 comments(댓글) 모델 간의 관계를 정의 - 1:N 관계 (사용자 한 명이 댓글 여러 개 작성) - 시퀄라이즈*에서는 1:N 관계를 hasMany로 표현 - 반대의 입장에서는 belongsTo(댓글.belongsTo(사용자)) - belongsTo 가 있는 테이블에 컬럼이 생김(댓글 테이블에 commenter 컬럼) ✨ 시퀄라이즈란? - 모델과 MySQL 의 테이블을 연결해주는 역할을 한다 https://inpa.tistory.com/entry/EXPRESS-%F0%9F%93%9A-%EC%8B%9C%ED%80%84%EB%9D%BC%EC%9D%B4%EC%A6%88-ORM [ORM] 📚 시퀄라이즈 초기 구성 & DB 연결 (MySQL) Se..