• Typescript 기본적인 설정을 마쳤다면 테스트 코드를 작성하여 확인해봅니다.

사전 준비

• Typescript 빌드 시 src 디렉터리를 기준으로 빌드할 수 있게 세팅이 되었기 때문에 src 디렉터리 내에 소스코드를 작성합니다.

src 디렉터리 생성

# src 디렉터리 생성
> mkdir src

관련 모듈 설치

• Express 프레임워크를 사용하기 위해 Express 모듈을 설치합니다.

> npm install express @types/express

• express: Node.js에서 Express를 사용하기 위한 모듈을 설치합니다.

• @types/express: Typescript 환경에서는 Node.js의 Express 모듈을 그대로 사용할 수 없기 때문에 Typescript 환경에 맞는 Express 모듈을 설치합니다.

• Typescript 개발 시 필요한 모듈

> npm install -D nodemon ts-node

• npm install 시 "-D" 옵션은 개발 의존성 (Dependency)으로 추가하는 옵션입니다.
• nodemon: 주로 개발 시에 사용되는 모듈이며, 코딩 시 파일 변경을 감지하여 자동으로 서버를 재시작하는 기능을 가지고 있습니다.
• ts-node: Typescript 컴파일러를 통하지 않고도, 직접 Typescript를 실행하는 모듈입니다.

테스트 코드 작성

• Typescript 예제로 Express 서버를 생성합니다.

테스트 코드

# app.ts

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

const app = express();
app.use(express.json());

const EXPRESS_PORT: Number = 7777;

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

app.listen(EXPRESS_PORT, () => {
    console.log(`Server Started... Port: ${EXPRESS_PORT}`);
});

• 4번 라인: Express 모듈과 모듈 내의 Request, Response 기능을 Import합니다.
• 6번 라인: Express를 초기화 하며, 상수 "app"에 할당합니다.
• 7번 라인: HTTP 통신 시 JSON 형식으로 통신하기 위해 선언합니다.
• 9번 라인: Express 서버를 접근하기 위한 포트를 선언합니다. (7777 Port)
• 11 ~ 13번 라인: HTTP 통신 확인 및 테스트를 위해 "GET" 메서드를 선언합니다. (GET /)
• 15 ~ 17번 라인: 9번 라인에서 선언했던 Port를 통해 Express 서버가 수신할 수 있도록 대기합니다.

package.json 스크립트 세팅

• Express 서버를 실행하기 위해 package.json의 script 부분을 수정해야 합니다.
• 위에서 설치한 ts-node 모듈을 활용하겠습니다.

{
  ...,
  "script": {
    "start": "nodemon --watch \"*.ts" --exec \"ts-node\" src/app.ts"
  },
  ...
}

# 서버 실행
> npm run start

• 정상적으로 서버가 실행되는 것을 확인할 수 있습니다.

소스코드

• 소스코드는 아래 레파지토리에서 확인할 수 있습니다.
  [Github] typescript-test

Reference

https://velog.io/@ansunny1170/Typescript-실습간단히-서버-띄우기