반응형

NestJS란 무엇인가?

NestJS는 Node.js 기반 백엔드 프레임워크로, TypeScript를 기본으로 사용하는 것이 특징입니다.

Angular 아키텍처에서 영향을 받아 모듈 기반 구조와 Dependency Injection(DI) 구조를 제공합니다.

Express는 자유도가 높은 대신 프로젝트가 커질수록 구조가 복잡해질 수 있지만
NestJS는 처음부터 구조화된 서버 아키텍처를 제공합니다.

주요 특징

  • TypeScript 기반
  • 모듈 구조 (Module / Controller / Service)
  • Dependency Injection 지원
  • Express 또는 Fastify 기반
  • 대규모 프로젝트에 적합

이번 글에서는 다음 과정을 정리합니다.

1️⃣ Node.js 설치
2️⃣ NestJS CLI 설치
3️⃣ NestJS 프로젝트 생성
4️⃣ 서버 실행


1. Node.js 설치

NestJS를 사용하려면 먼저 Node.js를 설치해야 합니다.

Windows에서 Node.js 설치

4

1️⃣ Node.js 공식 사이트 접속

https://nodejs.org

2️⃣ LTS 버전 다운로드

LTS(Long Term Support) 버전을 사용하는 것이 안정적입니다.

Node.js LTS
 

3️⃣ 설치 실행

다운로드한 .msi 파일을 실행합니다.

설치 과정

Next
Next
Next
Install
Finish
 

특별한 설정 없이 기본 옵션 그대로 설치하면 됩니다.


macOS에서 Node.js 설치

macOS는 두 가지 방법이 있습니다.

방법 1️⃣ 공식 설치 파일 사용 (가장 쉬움)

4

1️⃣ Node.js 공식 사이트 접속

https://nodejs.org

2️⃣ macOS LTS 다운로드

node-vXX.pkg
 

3️⃣ 설치 실행

Next → Install
 

방법 2️⃣ Homebrew 사용 (개발자 추천)

Homebrew가 설치되어 있다면 터미널에서 실행합니다.

 
brew install node
 

설치 확인

 
node -v
npm -v
 

2. Node.js 설치 확인

터미널 또는 명령 프롬프트에서 다음 명령을 실행합니다.

 
node -v
npm -v
 

정상 설치되었다면 다음처럼 출력됩니다.

v20.x.x
10.x.x
 

3. NestJS CLI 설치

이제 NestJS 프로젝트를 생성하기 위해 Nest CLI를 설치합니다.

 
npm install -g @nestjs/cli
 

설치 확인

 
nest --version
 

CLI가 정상적으로 설치되면 버전이 출력됩니다.


4. NestJS 프로젝트 생성

이제 프로젝트를 생성합니다.

 
nest new my-nest-app
 

명령을 실행하면 다음 메시지가 나타납니다.

Which package manager would you like to use?
 

선택

npm
 

설치가 완료되면 프로젝트가 생성됩니다.


5. NestJS 프로젝트 구조

프로젝트가 생성되면 다음 구조가 만들어집니다.

my-nest-app
├ src
│ ├ app.controller.ts
│ ├ app.module.ts
│ ├ app.service.ts
│ └ main.ts
├ package.json
├ tsconfig.json
└ nest-cli.json
 

각 파일 역할

파일설명
main.ts 서버 시작
app.module.ts 애플리케이션 모듈
app.controller.ts API 요청 처리
app.service.ts 비즈니스 로직

NestJS는 Controller / Service / Module 구조로 동작합니다.


6. NestJS 서버 실행

프로젝트 폴더로 이동합니다.

 
cd my-nest-app
 

개발 서버 실행

 
npm run start:dev
 

서버가 실행되면 다음 주소로 접속합니다.

http://localhost:3000
 

브라우저에 접속하면 다음 메시지가 나타납니다.

Hello World!
 

7. NestJS가 인기 있는 이유

1️⃣ 구조화된 백엔드 프레임워크

Spring Boot와 비슷한 구조라
대규모 프로젝트에 적합합니다.


2️⃣ TypeScript 기본 지원

  • 타입 안정성
  • 유지보수성 향상

3️⃣ Express / Fastify 선택 가능

기본은 Express지만
Fastify로 변경하면 더 높은 성능을 얻을 수 있습니다.

반응형
반응형

 

1. Express란 무엇인가?

Express는 Node.js에서 가장 오래되고 널리 사용되는 경량 웹 프레임워크입니다.

2009년에 등장했으며 현재도 많은 서비스에서 사용되고 있습니다.
Express는 단순함과 유연성이 가장 큰 특징입니다.

예를 들어 기본적인 API 서버는 다음과 같이 매우 간단하게 만들 수 있습니다.

 
const express = require('express')
const app = express()

app.get('/', (req, res) => {
res.send('Hello World')
})

app.listen(3000, () => {
console.log('Server running on port 3000')
})
 

Express는 필요한 기능을 직접 선택해서 조합하는 방식입니다.


Express 장점

1️⃣ 매우 단순하고 배우기 쉽다

Node.js를 처음 배우는 사람도 쉽게 시작할 수 있습니다.

구조가 강제되지 않기 때문에 작은 프로젝트에서는 빠르게 개발할 수 있습니다.


2️⃣ 생태계가 매우 크다

Express는 오래된 만큼 관련 라이브러리가 많습니다.

  • passport (인증)
  • multer (파일 업로드)
  • cors
  • body-parser

3️⃣ 자유로운 구조 설계

Express는 구조를 강제하지 않기 때문에

  • MVC
  • Clean Architecture
  • Layered Architecture

등 원하는 구조를 직접 설계할 수 있습니다.


Express 단점

1️⃣ 프로젝트가 커지면 구조가 무너지기 쉽다

Express는 구조가 강제되지 않기 때문에

대규모 프로젝트에서 다음과 같은 문제가 발생하기 쉽습니다.

  • 파일 구조가 난잡해짐
  • 코드 의존성 증가
  • 유지보수 어려움

2️⃣ TypeScript 지원이 완벽하지 않다

Express는 기본적으로 JavaScript 기반이라

TypeScript 사용 시 설정과 타입 정의를 따로 해야 합니다.


3️⃣ 엔터프라이즈 기능이 부족

다음과 같은 기능은 기본 제공되지 않습니다.

  • Dependency Injection
  • 모듈 시스템
  • 구조화된 아키텍처

2. NestJS란 무엇인가?

NestJS는 2017년에 등장한 Node.js 프레임워크
Angular 스타일의 구조를 Node.js 백엔드에 적용한 프레임워크입니다.

NestJS는 기본적으로 TypeScript 기반이며 대규모 프로젝트에 최적화된 구조를 제공합니다.

예시 코드:

 
@Controller()
export class AppController {
@Get()
getHello(): string {
return 'Hello World'
}
}
 

NestJS는 다음과 같은 구조를 중심으로 합니다.

  • Controller
  • Service
  • Module
  • Dependency Injection

NestJS 장점

1️⃣ 구조가 매우 체계적

NestJS는 기본적으로 모듈 기반 구조를 사용합니다.

src
├─ users
│ ├─ users.controller.ts
│ ├─ users.service.ts
│ └─ users.module.ts
 

이 구조 덕분에 대규모 프로젝트 유지보수가 쉽습니다.


2️⃣ TypeScript 완벽 지원

NestJS는 처음부터 TypeScript 기반으로 설계되었습니다.

덕분에

  • 타입 안정성
  • 자동완성
  • 코드 유지보수

측면에서 매우 유리합니다.


3️⃣ Dependency Injection 지원

NestJS는 **DI(의존성 주입)**을 기본 제공하기 때문에

  • 테스트 작성
  • 코드 분리
  • 유지보수

가 훨씬 편합니다.


4️⃣ 다양한 기능 내장

NestJS는 기본적으로 다음 기능을 제공합니다.

  • Validation
  • Authentication
  • WebSocket
  • Microservice
  • GraphQL
  • Swagger

NestJS 단점

1️⃣ 학습 곡선이 높다

NestJS는 다음 개념을 이해해야 합니다.

  • Module
  • Controller
  • Service
  • Provider
  • Dependency Injection

그래서 Express보다 진입 장벽이 높습니다.


2️⃣ 작은 프로젝트에서는 과할 수 있다

간단한 API 서버라면 NestJS는 오히려 구조가 너무 무거울 수 있습니다.

예를 들어 단순 CRUD API라면 Express가 훨씬 빠르게 개발됩니다.


3️⃣ 초기 설정이 많다

NestJS는 CLI를 통해 프로젝트를 생성하고
구조를 맞춰 개발해야 합니다.


Express vs NestJS 비교

항목ExpressNestJS
구조 자유 강제된 구조
언어 JavaScript 중심 TypeScript 중심
학습 난이도 낮음 중간
대규모 프로젝트 불리 매우 유리
개발 속도 빠름 구조 설계 필요
아키텍처 직접 설계 기본 제공

어떤 상황에서 사용하면 좋을까?

Express 추천 상황

  • 간단한 API 서버
  • 빠른 프로토타입 개발
  • Node.js 입문
  • 소규모 프로젝트

NestJS 추천 상황

  • 대규모 서비스
  • 팀 프로젝트
  • 유지보수 중요한 서비스
  • TypeScript 기반 개발
반응형
반응형

 

안녕하세요! 오늘은 현대 웹 개발에서 사실상 표준(De Facto)으로 자리 잡은 React 프레임워크, Next.js의 장점에 대해 파헤쳐 보려고 합니다.

단순히 "유행이라서"가 아니라, 왜 수많은 기업들이 기존 React SPA 방식에서 Next.js로 전환하고 있는지 그 명확한 이유를 정리해 드립니다.

1. 검색 엔진 최적화(SEO)의 끝판왕

일반적인 React(SPA)는 클라이언트 사이드 렌더링(CSR) 방식이라 구글이나 네이버 같은 검색 엔진 봇이 내용을 읽어가는 데 한계가 있습니다. 하지만 Next.js는 **서버 사이드 렌더링(SSR)**과 **정적 사이트 생성(SSG)**을 지원합니다.

  • 장점: 서버에서 미리 완성된 HTML을 보내주기 때문에 검색 노출에 압도적으로 유리합니다.

2. 눈에 띄게 빠른 초기 로딩 속도

사용자가 페이지를 요청했을 때 빈 화면을 보며 기다리는 시간을 최소화합니다.

  • Pre-rendering: 사용자가 접속하기 전에 서버에서 미리 페이지를 그려둡니다.
  • Image Optimization: 내장된 next/image 컴포넌트가 이미지 크기 최적화와 Lazy Loading을 자동으로 처리해 성능 지표(Lighthouse 점수)를 높여줍니다.

3. 직원보다 편한 '파일 시스템 기반 라우팅'

React에서는 react-router-dom 같은 라이브러리를 설치하고 일일이 경로를 설정해야 했죠? Next.js는 app 또는 pages 폴더 안에 파일을 만들기만 하면 파일 경로가 곧 URL이 됩니다.

  • 생산성: 별도의 설정 없이 직관적으로 페이지를 추가하고 관리할 수 있어 대규모 프로젝트에서 빛을 발합니다.

4. Full-stack 역량 (Route Handlers)

프론트엔드 프레임워크지만, 자체적으로 API를 구축할 수 있는 기능을 제공합니다.

  • NestJS와의 시너지: 복잡한 백엔드 로직은 NestJS로 구축하고, 간단한 데이터 처리나 Proxy 역할은 Next.js의 API Route를 활용해 효율적인 아키텍처를 설계할 수 있습니다.

5. 강력한 생태계와 Vercel의 지원

Next.js는 Vercel이라는 강력한 플랫폼 위에서 돌아갑니다. 클릭 몇 번으로 배포가 가능하며, 성능 모니터링부터 분석까지 한 번에 해결됩니다.

 

많은 분이 Next.js를 단순히 "SSR 해주는 도구"로 알고 계시지만, 사실 Next.js는 현대 웹 프레임워크가 갖춰야 할 모든 A to Z를 담고 있습니다. 특히 서버 측 로직에서는 앵귤러(Angular)의 철학을 계승하며 엔터프라이즈급 기능을 제공하죠.

6. 앵귤러(Angular)로부터 이어진 견고한 철학

Next.js(특히 App Router 이후)는 앵귤러의 구조적 엄격함모듈화 개념에 많은 영감을 받았습니다.

  • 영향력: 앵귤러가 보여준 '강력한 규격'은 Next.js에서 파일 기반 라우팅과 서버 컴포넌트 구조로 재탄생했습니다. 이는 개발자가 고민할 구조적 설계를 프레임워크가 대신 해주어 협업 효율을 극대화합니다.

7. 현대 웹 프레임워크의 필수 기능 집약체

Next.js는 단순히 화면을 그리는 것을 넘어, 백엔드 프레임워크 수준의 강력한 기능들을 내장하거나 완벽하게 지원합니다.

필수 기능 Next.js에서의 구현 및 지원
최신 스펙 지원 최신 ECMAScriptTypeScript를 기본으로 지원하여 안정적인 코드 작성이 가능합니다.
아키텍처(CQRS) CORS(Command Query Responsibility Segregation) 패턴을 적용하여 명령과 조회를 분리, 복잡한 데이터 처리를 효율적으로 관리합니다.
보안 (Security) HTTP 헤더 보안을 위해 Express의 Helmet 같은 기능을 미들웨어 계층에서 쉽게 설정하여 보안 취약점을 방어합니다.
인터셉터 & 미들웨어 요청과 응답 사이에서 데이터를 가공하는 Interceptor와 전역 로직을 처리하는 Middleware가 강력하게 구축되어 있습니다.
운영 효율화 정해진 시간에 작업을 수행하는 스케줄링, 시스템 흐름을 파악하는 로깅, 코드의 신뢰성을 높이는 테스팅 환경이 완벽히 구축됩니다.
문서화 & 데이터 API를 자동으로 문서화해 주는 Swagger와 데이터베이스 조작을 편리하게 돕는 **ORM(Prisma, TypeORM 등)**과의 궁합이 환상적입니다.

8. "Configuration over Code" - 편리한 설정

복잡한 웹팩(Webpack) 설정이나 바벨(Babel) 설정을 직접 만질 필요가 없습니다. Next.js는 Zero-config를 지향하며, 설치와 동시에 개발에만 집중할 수 있는 환경을 제공합니다.

반응형

+ Recent posts