Node.js + Express + Typescript 를 이용한 환경 셋팅!
매번 처음 개발을 시작하는 단계에서 번거롭게 다시 찾아보거나, 빠른 셋팅을 위한 기록이며,
VS code를 사용하여 개발을 진행하였습니다.
TypeScript
MS에서 개발하고 관리하는 오픈소스 프로그래밍 언어로서 자바스크립트 기반으로 변수의 데이터 타입을 지정하여 불필요한 에러(타입 에러)를 사전에 방지하여 예측 가능한 코딩이 가능하게 만들어 줍니다.
TypeScript 파일(.ts)은 브라우저에서 동작하지 않으므로 TypeScript 컴파일러(tsc)를 이용해 자바스크립트 파일로 변환해야 합니다.
시작하기
먼저 프로젝트에 사용할 폴더를 생성 후 vs code로 열고 터미널을 연다. 이후
$ npm init -y커맨드를 입력하여 packages.json파일을 생성해준다 뒤 -y 옵션은 설정시 필요한 질문들을 모두 yes 처리 한다. (설정 필요시 -y 옵션만 빼고 시작하면 된다)
필요 모듈 설치
$ npm i express typescript dotenv @types/dotenv @types/node @types/express
/// 개발시에만 사용할 모듈 설치 (-D 옵션)
$ npm i -D nodemon ts-node
- express: NodeJS를 사용하여 서버를 개발할 때 서버를 쉽게 구성할 수 있게 만든 프레임워크
- @types/express: express는 원래 자바스크립트로 만들어졌다. 이를 TS 환경에서 쓰기위해 express 내부의 변수들, 함수들의 타입을 정의한 ~d.ts 파일이 포함된 형태
- typescript: 타입스크립트 사용을 위해 설치
개발 시 필요한 모듈들(-D 옵션을 붙여서 설치)- nodemon: 노드 서버를 실행하고 소스코드를 수정하면 다시 재시작해야 하는 번거로움을 자동으로 해주는 모듈
- ts-node: Node.js용 TS 실행 엔진 및REPL(Node.js 상에서 TypeScript Compiler를 통하지 않고도, 직접 TypeScript를 실행시키는 역할을 한다. )
- dotenv: 환경변수를 사용하기 위한 모듈. 외부에 공개하면 안되는 민감한 정보들을 따로 관리하기 위해 사용
tsconfig.json 파일 생성
TypeScript로 짜여진 코드를 JavaScript로 컴파일하는 옵션을 설정하는 파일입니다. TypeScript 컴파일은 tsc 라는 명령어를 사용합니다.
아래 커맨드로 tsconfig.json 파일을 생성합니다.
$ tsc --init생성이 완료되면 여러가지 옵션이 있는 파일이 생성됩니다.
각 옵션에 대해서는 너무 많기 때문에 필요한 옵션들에 대해서만 확인 후 적용하는 것이 좋다.
옵션에 대한 설명
간단한 서버 실행코드 작성
import express, { Request, Response } from 'express'
import * as dotenv from "dotenv"
dotenv.config();
const app = express();
type Data = {
name: String,
age: Number,
url: String
};
const sendData: Data = {
name: 'gon',
age: 29,
url: 'gogle.con'
};
app.get("/test", (req: Request, res: Response) => {
res.send(sendData);
});
app.listen(process.env.PORT);서버 실행
서버 실행하기 위해서 package.json의 script부분을 수정해야 한다.
// 기존
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
// 변경
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "nodemon --watch \"*.ts\" --exec \"ts-node\" app.ts"
},터미널에 명령어로 서버를 시작!!
$ npm run dev브라우저 url에 http://localshost:3000/test 입력!
이렇게 정보가 보이면 성공!!
참고 자료
