[BackEnd][Node.js][nest.js-PJ] 사내 개발자 커뮤니티 서비스 - 초기 구성(Pipe, TypeORM, Configuration, Swagger, Logger)

 

 

Project Git Hub

 

 

🗂 목차

● [BackEnd][Node.js][nest.js-PJ] 사내 개발자 커뮤니티 서비스 - 초기 구성(Pipe, TypeORM, Configuration, Swagger, Logger)

● [BackEnd][Node.js][Nest.js] 사내 개발자 커뮤니티 서비스 - 회원 가입

● [BackEnd][Node.js][Nest.js] 사내 개발자 커뮤니티 서비스 - JWT를 이용한 Login

● [BackEnd][Node.js][Nest.js] 사내 개발자 커뮤니티 서비스 - Passport, JWT를 이용한 인가 처리

● [BackEnd][Node.js][Nest.js] 사내 개발자 커뮤니티 서비스 - Custom Decorator

● [BackEnd][Node.js][nest.js-PJ] 사내 개발자 커뮤니티 서비스 - 게시판 만들기 : 초기 구성(Entity, Controller,Module,Repository,Service)

 

 

 

 

📚 부록

● [Node.js] Node.js 기초
● [JavaScript] 기본 문법 
● [BackEnd][Node.js] 사내 개발자 커뮤니티 서비스 - 초기 구성
● [BackEnd][Node.js] 사내 개발자 커뮤니티 서비스 - 초기 구성 : DB 연결
● [BackEnd][Node.js] 사내 개발자 커뮤니티 서비스 - 초기 구성 : DB 연결(Sequelize)
● [Web] URL의 이해
● [Spring] Spring이란?
●[Node.js][Nest.js] 유효성 검사와 Data 형식 변환하기 - Pipe
●[Node.js][Nest.js] Configuration (설정)
●[Node.js][Nest.js]TypeORM
● [Node.js][Nest.js] Logger 기능
●[JavaScript] Promise와 async 그리고 await 
● [Nest.js] API 설계 - 요청, 응답 객체 (Request, Response Object) 
● [정보보안] JWT(JSON Web Token) 이란? 
● [Nest.js] Middle Ware(미들웨어)

 

 

 

 

🤔 내가 만난 Error

● [Node.js][Error] Cannot find module '.dotenv'

 

 

 

 

 

 

 

 

 

🚀 Nest.js Project 시작하기

    🔽  개요

안녕하세요? 주니하랑은 이전 포스팅에서 `Node.js`, `Express.js`, `Sequelize`를 이용하여 Project를 진행해보려 하였고, 이에 대한 초기 구성에 대해 글을 작성 했었습니다.

그런데, 찾아보니 `Nest.js`가 주니하랑에게는 너무나도 잘 맞는 Framwork라고 생각이 된 것이에요.

그 이유는 주니하랑은 `JAVA` 기반의 `Spring Boot`를 열심히 공부 중이였는데, `Node.js`도 공부하면 좋을만한 이유가 생겨서 한번 공부를 해보던 도 중 `Express.js`를 공부하면서 이해하는 것보다 일단 `Nest.js`를 통해 `Spring Boot`와 비슷한 방법으로 `Node.js`를 공부하는 것이 좋다고 판단한 것이에요.

이번 포스팅 시리즈는 지난 `Spring Boot`의 `Maven`과 `MyBatis`를 이용한 `[BackEnd][Maven-PJ] 사내 개발자 커뮤니티 서비스 시리즈`를 `Node.js`의 `Nest.js`로 바꿔서 코딩을 해보면서 공부를 하려고 하는 것이에요.

그런 이유로 이번 포스팅부터 다시 처음부터 Project를 구성하고, 진행을 해보려 합니다. 

참고로 `Spring Boot` Project 에서도 `RESTFul `하게 만들지 않았었고, 몇가지 문제가 있다고 언급했었는데, 이번 Project도 일단 동일하게 구축을 하고, 나중에 `Refectoring`을 진행할 것이에요.

 

 

        📦  Nest.js란?

`Nest.js`는 효율적이고, 확장 가능한 `Node.js` Server 측 Application 구축을 위한 Framwork인 것이에요.

프로그레시브 `JavaScript`를 이용하고, `TypeScript`로 Build 및 완벽 지원되며 (개발자가 순수 `JavaScript` 문법으로 Coding 가능) `OOP(Object Oriented Programming)`, `FP(Functional Programming)`, `FRP(Functional Reactive Programming)` 요소를 이용할 수 있게 해 주는 것이에요.

`Nest.js`는 앞 써 `Spring Boot`와 유사하다고 했는데, 게시판 등을 만들 때 `Spring Boot`와 동일한 `MVC Pattern`을 이용할 수 있는 것이에요.

주니하랑은 게시글에 관한 Module과 인증, 인가에 대한 Module을 이용할 것이고, 각 Module을 구성하는 `Controller`, `Service`, `Repository` 등을 이용해서 서비스를 구축할 것이에요.

 

        📦  Nest.js 내부 구성

`Nest.js`는 내부적으로 `Express.js(Default Value)`와 같은 강력한 `HTTP Server Framwork`를 사용하며, 선택적으로 `Fastify`를 이용할 수 있도록 구성 할 수 있는 것이에요.

 

💡 참고 사항
Fastify란?

`Fastify`를 이용하는 가장 대표적인 이유는 효율적인 Server는 낮은 비용으로 높은 응답성을 보여 이용자 경험을 향상시켜야 하는데, 이를 위해 보안성을 유지하고, 개발자의 개발 불편함을 최소화하면서 수 많은 이용자들의 요청을 효과적으로 처리해 줄 필요가 있다.

`Fastify`는 최소한의 오버헤드와 강력한 플러그인 아키텍처로 최고의 개발 환경을 제공하는데 중점을 둔 `Web Framwork`
즉, `Nest.js`, `Express.js`와 같은 `Web Framwork`이다.
`Hapi`와 `Express`를 참고해 만들어졌으며, 현재 가장 빠른 `Web Framwork` 중 하나이다.

`Nest.js`는 이러한 공통 `Node.js` Framework (`Express.js`, `Fastify`)위에 추상화 수준을 제공하지만, API를 개발자에게 직접 노출하는 특징이 있는 것이에요. 이를 통해 개발자는 기본 Platform에서 사용할 수 있는 수 많은 타사 Module을 자유롭게 이용할 수 있답니다.

 

 

        📦  Nest.js 철학

`Node.js 및 Server 측 JavaScript`를 위한 훌륭한 Library를 지향하는 것이에요.

다른 Library도 많이 존재하지만, 이들 중 어떤 것도 아키텍어의 주요 문제를 효과적으로 해결하지 못하는 단점이 있는 것이에요.

`Nest.js`는 개발자와 개발팀이 고도로 Test 가능하고, 확장 가능하며, 느슨한 결합을 추구하고, 유지 관리가 쉬운 Application을 만들 수 있는 즉시 사용 가능한 Application 아키텍처를 제공하는 것이에요.

이 아키텍처는 `Angular`에서 영감을 받았다고 해요!

 

Nest JS 공식 문서

 

 

        📦  Nest.js 기본 구조

이   름	설   명
eslintrc.js	개발자들이 특정한 규칙을 가지고 Code를 깔끔하게 짤 수 있게 도와주는 Library. TypeScript를 쓰는 Guide Line을 제시해주고, 문법에 문제가 있으면 알려주는 역할 등 수행
prettierrc	주로 Code 형식을 맞추는데, 이용. 작은따옴표(')를 사용할지 큰 따옴표(")를 사용할지 혹은 Indent 값을 2 혹은 4로 줄지 등등에 이용. Error를 찾는 것이 아닌 Code 포맷터 역할 수행.
nest-cli.json	nest Project를 위해 특정한 설정을 할 수 있는 json File.
tsconfig.json	어떤 방식으로 TypeScript를 Compile할지 설정하는 부분.
tsconfig.build.json	tsconfig.json의 연장선상의 파일. bvuild를 할 때, 필요한 설정을 하는 부분. "excludes"에서는 Build 할 때, 필요 없는 File들 명시.
package.json	build : 운영 환경을 위한 Build. Format : Lint Error 발생 시 수정. start : Application 실행.
src	대부분의 비즈니스 로직이 하위에 구성. main.ts : Application 생성 및 실행 (JAVA의 경우 Main()이 있는 Class) app.module.ts : Application Module 정의

 

 

 

        📦  Nest.js Module

App Module 안에 게시판 Module과 회원 관련 Module이 있다면 각 Module안에 `Controller`, `Entity`, `Service`등이 있는 것이에요.

Module은 `@Module()`이라는 `Decorator(JAVA의 Annotation)`이 달린 Class인 것이에요.

`@Module()` Decorator는 `Nest.js`가 Application 구조를 구성하는데, 이용하는 `Meta Data`를 제공한답니다.

각 Application에는 하나 이상의 Module(Root Module)이 존재하는데, Root Module은 `Nest.js`가 이용되는 시작점인 것이에요.

 

Module은 밀절하게 관련된 기능 집합으로 구성 요소를 구성하는 효과적인 방법을 제시하는 것이에요.
(기능별 구현 :예 User Module, Oders Module, Chat Module)

같은 기능에 해당하는 것들을 하나의 Module Directory안에 넣어 구현하는 것이에요.

Module은 기본적으로 `싱글 톤`이므로, 여러 Module 사이에 쉽게 공급자가 동일한 인스턴스를 공유할 수 있는 것이에요.

 

 

 

 

주니하랑은 이번 `Node.js` Project에서 핵심 기능으로 선택한 Q&A 게시판과 인증, 인가 및 회원 가입에 대해서 포스팅을 작성하려 하는 것이에요. `Spring Boot` Project도 이 두 가지 기능만 포스팅을 남길 것이고, 나머지는 추가 게시판들이라 따로 포스팅을 남기지는 않을 것이에요. 완성된 Code는 `Git Hub`에 올려 두도록 하겠습니다!

 

 

 

 

🚀 초기 구성

    🔽  설치

        📦 Node.js

https://nodejs.org/ko/

Node.js

위의 공식 Site에 들어가면 아래 그림과 같은 화면이 나오는 것이에요.

 

node.js 공식 홈페이지

 

이 곳에서 자신의 운영체제(OS)에 맞는 LTS Version을 설치하면 되는 것이에요.

 

주니하랑은 `MacOS`를 탑재한 `MacBook`을 쓰고 있는 것이에요.

 

설치가 다 되고 나면 아래 명령어로 설치가 되었는지 확인할 수 있는 것이에요.

 

명령어

node -v

 

$ node -v

반응형

 

 

 

 

 

        📦 Nest.js - Nest.js CLI로 Nest.js 설치하기

`Spring Boot`의 경우 초기 환경 설정을 할 때, `Spring initalizr` 등을 이용해서 File들을 넣어주는데, `Node.js`의 경우 명령어 기반으로 초기 환경 구성을 하는 차이점이 있는 것이에요. 아무래도 `Node.js`는 CLI를 어느정도 다룰 줄 알아야 편하겠어요!

 

참고로 아래 명령어들은 Project Directory에서 입력해줘야 한다는 걸 잊으면 안되는 것이에요.

 

Project Directory

 

 

명령어

npm install -g @nestjs/cli

먼저 위의 명령어를 통해 `Nest.js`의 CLI를 받아줘야 하는 것이에요.

 

Permission Denied Error

Mac OS나, Linux와 같은 OS에서는 위와 같은 `권한 문제`로 인해 설치가 안될 수 있는 것이에요.

그 이유는 `root` 권한이 아니기 때문인데, 이럴때는 아래와 같이 명령어를 입력 해 주면 되는 것이에요.

 

명령어

sudo npm install -g @nestjs/cli

 

$ sudo npm i -g @nestjs/cli

 

 

 

명령어

nest new {Projcet-Name}

그런 뒤 위의 명령어를 입력하면 Project 이름에 맞는 파일과 모듈들이 내려 받아 지면서 초기 환경 구성이 완료 되는 것이에요.

 

$ npm new {Project-Name}

위의 명령어를 입력하면 `Package Manager`를 어떤 걸 사용하겠냐고 묻는데, 주니하랑은 `npm`을 이용할 것이에요.

 

참고로 Project 이름의 Directory를 만들고, 그 안에서 위의 명령어를 입력하면 Project 이름 Directory 안에 똑같은 Directory가 또 생기고, 그 안에 파일들이 생기는데, 이 부분을 주의해야 하는 것이에요.

 

 

`Nest.js`가 설치해줘서 고맙다고 하네요!

 

초기 환경 구성 완료

초기 환경 구성이 완료되면 위와 같이 파일들이 생성 되는 것을 볼 수 있는 것이에요.

 

 

 

명령어

nest --version

`Nest.js`가 제대로 설치 되었는지 확인 해보고 싶다면 위의 명령어를 입력하면 되는 것이에요.

 

$ nest --version

 

 

 

 

        📦 Pipe

먼저 `Pipe`에 대한 자세한 내용은 `이 곳`에 준비 해 둔 것이에요.

 

명령어

npm install class-validator class-transformer --save

 

$ npm install class-validator class-transformer --save

 

`Pipe`를 이용하기 위해서는 `class-validator`, `class-transformer` Module이 필요한 것이에요.

위와 같이 설치 해 주시면 됩니다.

 

 

Documentation Page

 

 

 

 

        📦 TypeORM - Data Base 연동

먼저 `TypeORM`에 대한 자세한 내용은 `이 곳`에 준비 해 둔 것이에요.

 

$ npm install typeorm@0.2 @nestjs/typeorm mysql2 --save

 

 

directory path

최초 설정 File을 만들기 위해 `/src` 밑에 `config` Directory를 만들고, 그 밑에 `typeorm.config.ts`를 만들어 이 곳에서 Data Base 설정을 해 줄 것이에요.

참고로 주니하랑은 밑에서 `Configuration`을 이용하여 민감 정보를 숨길 것이기 때문에 `typeorm.config.ts`에서 직접적인 Data Base 정보를 입력하지 않을 것이에요.

 

 

typeorm.config.ts

최초 두번째 줄에 밑에서 언급할 설정 내용들을 `import` 해주고, 4번째 줄에서 해당 설정 파일에 `db`라는 이름을 가진 내용 (밑 그림 참고)에 내용을 가져와 dbConfig에 넣어준 것이에요.

6번째 줄에 `export` Keyword를 통해 `@nestjs/typorm` Module를 `improt` 한 인스턴스 `TypeOrmModuleOptions` 객체 자료형 Type으로 갖는 상수형(const) 객체('{}') `typeORMConfig`를 다른 곳에서도 사용할 수 있게 내보내기 하고, Data Base 설정 값들을 넣어준 것이에요. `process.env.**`는 나중에 AWS와 같은 Cloud 환경에서 Data Base를 이용할 때, 해당 내용을 가져오게 하기 위함이고, `dbConfig.**`은 밑에서 언급할 설정 내용에서 값을 가져와 주는 것이에요.

`Spring Boot`에서는 `application.yml`, `application.properties`에 값을 `@Value()`를 통해 가져올 수 있는데, 이것과 매우 유사한 기능인 것이에요.

17번째 줄에 `entities`는 `Entity` 객체를 찾기 위한 설정이고, 29번째 줄에는 Application이 실행할 때, 설정값에 따라 true, false가 바뀌도록 한 것이에요.

 

 

default.yml

 

 

 

        📦 Configuration (설정)

먼저 `Configuration`에 대한 자세한 내용은 `이 곳`에 준비 해 둔 것이에요.

 

$ npm install config --save

 

 

config Directory 생성

 

 

config Directory 생성

 

 

설정 File 생성

 

 

default.yml

 

 

development.yml

`development.yml` 에서는 Data Base Management System의 IP, 이용자 IP, Password를 넣어준 것이에요.

마지막 `synchronize`를 true로 설정하면 `Spring Boot`의 `JPA` 기능으로 `ddl-auto`를 통해 `Entity`를 읽어 자동으로 Table을 만들어주고, 변경해주는데, 이와 동일한 기능을 하는 것이에요.

주니하랑은 이 전에 진행하고 있던 `Spring Boot` Project로 인해 이미 DB Table들을 가지고 있기 때문에 false로 설정해 줄 것이에요.

 

 

production.yml

운영 환경에서 이용할 Data Base가 있다면 해당 정보를 넣어주고, `synchronize`는 false로 설정을 하는데, 그 이유는 운영이라면 실제 서비스를 구동하는 환경이고, `synchronize`가 true 라면 `Entity` 변경이 있을 때, 개발자가 의도하지 않은 DB 변동이 발생할 위험이 높기 때문인 것이에요.

 

이제 `main.ts`에서 위 설정들이 인식되도록 해 줘야 하는 것이에요.

 

configuration 구성 전

 

 

 

configuration 구성 뒤

3번째 줄에 설정 파일을 `import`하고, 8번째 줄에 해당 설정 Module 객체에서 `get()`을 통해 `default.yml`에 선언된 server 내용을 가져와 상수형 변수 serverConfig에 넣어준 것이에요.

serverConfig 변수 안에는 port 번호가 있고, 그 번호를 상수형 변수 port에 넣어준 뒤 Application이 동작할 때, 8080 Port로 동작하게 해 준 것이에요.

 

이제 Server가 정상적으로 구동되는지 확인 해 볼 것이에요.

 

package.json

 

 

 

        📦 Swagger 설정

`Swagger`가 무엇인지 알고 싶으신 분들을 위해 개요를 `이 곳`에 준비 해 둔 것이에요.

 

`Swagger`는 `Nest.js`에서 이용할 수 있도록 Module이 제공 되고 있는 것이에요.

 

명령어

npm install @nestjs/swagger swagger-ui-express --save

 

만약 `Nest.js(fastify)`을 이용한다면 `swagger-ui-express` 대신 `fastify-swagger`를 설치하여야 하는 것이에요.

 

명령어

npm install @nestjs/swagger fastify-swagger --save

 

 

주니하랑은 아래 명령어를 통해서 설치 해 줄 것이에요.

npm install @nestjs/swagger swagger-ui-express --save

 

 

 

 

swagger.config.ts

최초 Swagger를 이용하기 위해서 설정 Class를 만들어줘야 하는 것이에요.

`DocumnetBuilder()`를 통해 문서의 기본을 구성할 수 있도록 해 주었고, `Builder Pattern`을 이용해서 제목, 내용, 버전을 설정해 준 것이에요.

그런 뒤 API문서를 만들어주기 위해 `createDocumnet()`를 호출해서 Appication에 대한 내용을 넣어주고, 문서의 구성 내용을 함께 넣어 준 뒤 상수형 변수 document에 넣어준 것이에요.

그런 뒤 `setup()`을 호출하여 개발자가 Web Browser을 통해 Swagger 문서를 확인할 수 있는 URI Path를 넣어준 것이에요.

main.ts

그리고 위 13번째 줄과 같이 main.ts에 swaggerConfig 설정 코드를 입력해 주어야 해요.

 

 

 

 

 

🚀 Nest.js Project Server 구동하기

 

 

12 ~ 15번째 까지 유심히 지켜볼 필요가 있는 것이에요.

12번째 줄은 `nest.js` Application 구동 명령어인 nest start가 들어 있고, 13 ~ 15번째 줄까지는 각 환경(개발, 운영 등)에 맞는 동작을 하도록 명령어가 Value로 등록되어 있고, Key로 이름을 명시한 뒤 객체 Type으로 선언되어 있는 것이에요.

 

명령어

npm run start:dev

 

현 시점 Project는 개발 단계이기 때문에 위의 명령어를 통해 Server를 구동할 것이에요.

 

 

Server가 정상적으로 동작하였고, 설정 내용도 정상적으로 처리가 되고 있음을 알 수 있는 것이에요.

 

 

Swagger 기본 구성 완료 뒤 접속

위와 같이 초기 구성한 `Swagger API` 문서에 잘 접속한 것을 볼 수 있는 것이에요.

이제 개발을 하면서 `Controller` 등에서 `Decorator(JAVA : Annotaion)`을 이용해서 문서를 계속 작성해 나가면 되는 것이에요. 

 

 

다음 글 : [BackEnd][Node.js][Nest.js] 사내 개발자 커뮤니티 서비스 - 회원 가입