본문 바로가기
web/test

node.js - typescript 와 express.js 를 이용하여 간단한 어플리케이션 서버 구현

by 기공준 2021. 4. 2.
반응형

이 테스트는 mac os에서 진행하였습니다.

 

터미널에서 홈브루를 이용하여 node js를 먼저 설치해줍니다.

홈브루 설치는 따로 이 글에서 다루지는 않겠습니다.

 

brew install node

 

 

다음은 typescript 패키지를 npm을 이용하여 전역에 설치해줍니다.

 

npm i -g typescript

 

저장공간 아무 곳이나 폴더를 하나 만들고 npm init으로 프로젝트를 하나 생성해줍니다.

 

다음은 필요한 패키지들은 설치합니다.

 

npm i --save-dev @type/node @type/express nodemon ts-node

 

@type/node는 typescript로 코드를 작성할 시  node 타입 체크를 위하여 node 타입을 추가해주는 패키지입니다.

@type/express는 위와 같은 목적으로 express타입을 추가해주는 패키지입니다.

nodemon은 테스트 코드 실행을 위해 설치합니다.

ts-node는 node.js에서 typescript를 실행하기 위해서 설치합니다.

 

다음은 tsconfig.js를 만들고 수정하겠습니다.

 

tsc --init //tsconfig 생성

 

//tsconfig.js 내용
{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "outDir": "dist"
    },
    "include": [
        "src/**/*.ts"
    ],
    "exclude": [
        "node_modules"
    ]
}

 

ts로 빌드한 js 파일은 dist에 저장되도록 설정

실제 작업할 ts 파일들은 src 밑에 만들 예정이라 include의 경로를 이렇게 설정했습니다.

 

src 폴더를 만들고 index.ts를 만듭니다.

 

//index.ts

import * as express from "express";
const app = express();
const port = 3000;

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

app.listen(port, () => {
    console.log(`Example app listening at http://loaclhost:${port}`);
})

 

마지막으로 package.json의 스크립트 부분을 서버 실행 후 ts파일을 수정하면 수정사항들을 바로 확인할 수 있도록 수정

 

 "scripts": {
    "test": "nodemon --exec ts-node src/index.ts --watch"
  },

 

node test를 실행하면 서버 구동 끝

 

반응형

댓글