NestJS - Socket 통신을 이용한 간단한 채팅페이지 구현하기 # 1

이번 시리즈에서는 NestJS, EJS, 및 Socket.io를 사용하여 실시간 채팅 서버를 구축하는 방법을 소개합니다. NestJS는 효율적인 백엔드 애플리케이션을 구축할 수 있는 강력한 Node.js 프레임워크입니다. EJS는 쉽게 HTML 템플릿을 생성할 수 있는 서버 사이드 템플릿 엔진이며, Socket.io는 실시간 어플리케이션을 만들기 위한 라이브러리입니다. 이 글에서는 프로젝트 설정과 NestJS에 대한 간단한 소개를 진행합니다.

 

완성모습

더 많은 기능들과 더 이쁜 디자인이 추가되면 좋겠지만 이번 토이프로젝트의 목적은 간단한 채팅기능페이지 구현이기 때문에 더 많은 기능 을 구현하진 않았습니다. 추후에 기능확장과 디자인 수정은 고려해보겠습니다.

 

NestJS 개요

NestJS는 TypeScript를 사용하여 개발되었으며, Angular의 철학을 따르는 효율적인 및 확장 가능한 서버 사이드 애플리케이션을 구축하기 위한 Node.js 프레임워크입니다. NestJS는 다양한 기능을 제공하는 모듈 시스템을 활용하여 구조화 된 애플리케이션을 쉽게 개발할 수 있습니다. 또한, Express와 같은 다른 인기 있는 Node.js 라이브러리를 사용하여 백엔드 로직을 구현할 수 있습니다.

 

프로젝트 설정

먼저, NestJS CLI를 설치해야 합니다. 다음 명령어를 실행하여 전역 설치를 진행하세요.

npm i -g @nestjs/cli

 

CLI가 설치되면, 다음 명령어로 새로운 NestJS 프로젝트를 생성합니다.

nest new chat-server

생성된 프로젝트 폴더로 이동한 뒤, 필요한 패키지를 추가로 설치합니다.

cd chat-server
npm install ejs socket.io @types/socket.io

이제 프로젝트 구조와 NestJS의 주요 구성 요소를 살펴보겠습니다.

 

NestJS 프로젝트 구조

기본적인 NestJS 프로젝트 구조는 다음과 같습니다:

chat-server/
├── src/
│   ├── app.controller.ts
│   ├── app.module.ts
│   ├── app.service.ts
│   ├── main.ts
├── .eslintrc.js
├── .gitignore
├── .prettierrc
├── nest-cli.json
├── package.json
├── README.md
├── tsconfig.build.json
└── tsconfig.json

주요 파일에 대한 설명:

• src/main.ts: 애플리케이션의 엔트리 포인트로, NestJS 애플리케이션을 시작합니다.
• src/app.module.ts: 애플리케이션의 루트 모듈로, 다른 모듈과 서비스를 불러옵니다.
• src/app.controller.ts: 기본 컨트롤러로, 라우팅 및 요청 처리를 담당합니다.
• src/app.service.ts: 기본 서비스로, 비즈니스 로직을 구현하는 데 사용됩니다.

 

정리

이제 프로젝트 설정 및 NestJS에 대한 간단한 소개를 마쳤습니다. 다음 글에서는 EJS를 사용하여 뷰를 구성하고, 그 다음에는 Socket.io를 사용하여 실시간 채팅 기능을 구현하는 방법을 설명하겠습니다. 이 시리즈를 통해 NestJS, EJS 및 Socket.io를 활용하여 강력한 실시간 채팅 애플리케이션을 만들 수 있게 될 것입니다.