1. Algorithm Self Study

  2. Backend Class

NestJS

  • NestJS는 TypeScript(타입 스크립트)를 지원하는 효율적이고 확장 가능한 Node.js의 서버 애플리케이션 프레임워크
  • =>NestJS는 Architecture 구조를 제공함으로써 Node.js의 주요 문제를 해결
  • NestJs는 Node.js를 위한 프레임워크로, 규칙과 구조 없이 자유분방한 node.js를 순식간에 Python+Django, Java+Spring 수준으로 만들어 줌
  • 즉시 사용 가능한 애플리케이션 아키텍처를 제공
  • 그 외에도 TypeScript기반의 Framework이며 Dependency Injection(의존성주입)Inversion of Control(제어의 역전)Module을 통한 구조화 등 생산성에 용이
    => Module 구조는 Architecture를 조직적(Organize)으로 가져가게 하고 느슨한 결합(Loose Coupling) 을 가능하게 만들어 확장성(Extensible)과 테스트 가능성(Testable)을 높임

    GUI

    평소 우리가 컴퓨터에서 폴더 아이콘을 클릭해 들어가 안에 있는 파일들을 아이콘으로 보고, 또 그것들을 클릭해서 실행 => GUI, graphical user interface

    CLI

    Command-line interface로 터미널에서 명령어를 입력해 폴더를 열고, 파일을 실행하는 등의 상호 작용하는 방식
    nestjs/cli를 설치하면 nest 명령어를 사용할 수 있게 됨

NestJS 폴더 구조

  • 보일러 플레이트( 초기 폴더 구조 ) : 새로운 프로젝트를 실행할때 처음 만들어진 Nest 폴더 구조
    => 모든 회사가 같은 보일러 플레이트를 가지고 있는 것 X
    회사에 따라 가지고 있는 필요한 기능들이 내장되어 있는 보일러 플레이트가 존재하게 되는 것

package.json

프로젝트 전체 설명서

scripts 는 명령어를 쉽게 실행할 수 있도록 단축 명령어

  • 시작 : "start": "nest start" 의 start 로 실행

    • 개발할 때 : "start:dev" 사용 (dev 는 development 의 약자) ⇒ 우리가 사용할 명령어
    • 배포할 때 : "start:prod" 사용 (prod 는 production 의 약자)
  • Nest 자체에서 nodemoon 기능을 제공해주고 있기에 nodemoond은 필요X

    ( "start:dev": "nest start --watch" ⇒ watch : 소스코드가 바뀌면 자동으로 리프레쉬 해주는 것 )

  • test : 배포전에 테스트 코드를 작성해서 실행시켜 봄으로 모든 API가 제대로 작동하는지 확인하는 것으로 보다 안전한 개발을 하기 위한 것

// package.json

"scripts": {
    "prebuild": "rimraf dist",
    "build": "nest build",
    "format": "prettier --write \"src/**/*.ts\" \"test/**/*.ts\"",
    "start": "nest start",
    "start:dev": "nest start --watch",
    "start:debug": "nest start --debug --watch",
    "start:prod": "node dist/main",
    "lint": "eslint \"{src,apps,libs,test}/**/*.ts\" --fix",
    "test": "jest",
    "test:watch": "jest --watch",
    "test:cov": "jest --coverage",
    "test:debug": "node --inspect-brk -r tsconfig-paths/register -r ts-node/register node_modules/.bin/jest --runInBand",
    "test:e2e": "jest --config ./test/jest-e2e.json"
  },
  • dependencies : 백엔드 서버를 실행시킬 때 필요한 모듈들이 위치
  • devDependencies : VS code 내에서 개발할 때 필요한 모듈들이 위치

eslint vs prettier

Prettier : formatter => 스타일 교정
eslint : linter => 오류 교정

ESLint에도 코드 포맷팅이 있지만 Prettier에 비해 특화되어있지 않으므로, 코드 에러와 문법을 탐지할때는 ESLint를 사용하고 포맷팅에는 Prettier를 사용

// .prettierrc

{
      "singleQuote": true, //“ “ 를 ‘ ‘ 로 통일
      "trailingComma": "all" //문장 제일 끝에 콤마( , ) 를 자동으로 붙여주는 것
}

TypeScript 폴더 구조

API 만들 때
app.controller.ts
app.module.ts // controller 와 service 가 합쳐짐
app.service.ts

// app.module.ts

import { Module } from '@nestjs/common';
import { AppController } from './app.controller';
import { AppService } from './app.service';

@Module({
  imports: [],
  controllers: [AppController],
  providers: [AppService], //app.service.ts
})
export class AppModule {} // main.ts 에 import
// app.controller.ts

import { Controller, Get } from '@nestjs/common';
import { AppService } from './app.service'; //서비스 불러오기 

@Controller()
export class AppController {
  constructor(private readonly appService: AppService) {}

  @Get()
  getHello(): string {
    return this.appService.getHello();
  }
}
  • @Controller() : 데코레이터함수의 정의 전에 호출되며 기존 객체에 새로운 기능을 추가할 수 있도록 하는 디자인 패턴
  • @Get() : Get 요청이 실행되는 부분으로, ( ) 안에 dafault 값은 ‘/’

NestJS started with GraphQL & TypeScript

Schema First

graphql의 schema를 먼저 정의하고, 그 schema 정의에 맞게 코드를 작성하는 방법
SDL(Schema Definition Language) : 모든 프로그래밍 언어와 독립적이며, 통합되는 언어이고, NestJS에서는 GraphQL 스키마를 TypeScript의 클래스 및 인터페이스 형식으로 구현
스키마 정의와 함께 Resolver가 계속적으로 동기화되어야하며 Resolver 코드와 SDL의 정의가 정확하게 일치해야하는 단점이 존재

// cat.graphql

type Query {
  cats: [Cat]
  cat(id: ID!): Cat
}

type Mutation {
  createCat(createCatInput: CreateCatInput): Cat
}

type Subscription {
  catCreated: Cat
}

type Owner {
  id: Int!
  name: String!
  age: Int
  cats: [Cat!]
}

type Cat {
  id: Int
  name: String
  age: Int
  owner: Owner
}

input CreateCatInput {
  name: String
  age: Int
}

Code First

데코레이터와 TypeScript 클래스를 사용하여 먼저 작성한 Resolver 을 기반으로 해당 GraphQL 스키마를 자동 생성

GraphQLModule.forRoot<ApolloDriverConfig>({
      driver: ApolloDriver,
			autoSchemaFile: 'src/common/graphql/schema.gql',
})

schema first는 graphql schema를 먼저 작성한 후, typescript 클래스나 인터페이스를 생성해 주고
**code first**는 typescript로 클래스를 만들면 해당 클래스에 해당하는 graphql schema를 자동으로 만들어 줌

GraphQL 폴더 구조

  • apis : API 폴더
  • common : 모든 API 에서 공통적으로 사용되는 것들을 따로 빼놓는 폴더
  • .module.ts : .resolver.ts + .service.ts 합쳐주는 파일
  • .resolver.ts : 실질적 API 로직
    • .controller.ts 와 같은 파일로 이름만 다른 파일
  • .service.ts : 핵심 비즈니스 로직

0개의 댓글