Typescript 적용해 Express 사용하기

Typescript를 사용해 nodejs - express 환경 구현하는 방법에 대해 알아보도록 하자.

1. Typescript 글로벌 설치

npm install -g typescript

타입 스크립트를 글로벌로 설치해주자.

2. 프로젝트 생성

npm init

npm 프로젝트를 생성한다.

3. 필요 모듈 설치

npm install express --save
npm install ts-node typescript nodemon @types/node @types/express --save-dev

4. tsconfig 설정

tsc --init

위의 명령어를 입력하면 tsconfig.json 파일이 생성되는데, 아래와 같이 수정해주면 된다.

{
  "compilerOptions": {
     "lib": [
        "es5",
        "es6"
     ],
     "target": "es5",
     "module": "commonjs",
     "moduleResolution": "node",
     "outDir": "./build",
     "esModuleInterop": true,
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
     "sourceMap": true
  }
}

5. 실행 스크립트 생성

package.json 파일의 script에 아래 부분을 추가하자.

{
    ...
    "scripts": {
        "start": "nodemon --exec ts-node index.ts"
    }
}

6. index.ts

이제 여기부터 타입스크립트를 사용해 코드를 작성하면 된다. 디렉터리 내에 index.ts 파일을 생성하고 아래의 코드를 입력해보자.

import express, {Request, Response} from 'express';

class App {
    public application: express.Application;

    constructor() {
        this.application = express();
    }
};

const app = new App().application;

app.get('/', (req: Request, res: Response) => {
    res.send('Hello World!');
});

const PORT = 3000;
app.listen(PORT, () => console.log('Listen on port ${PORT}'));

7. 실행하기

이제 우리가 5번에서 설정한 스크립트로 실행하면 된다.

npm run start

위의 명령을 입력하면, 3000번 포트에 서버가 떠 있을 것이다.