nodejs express typescript 설정
타입스크립트 기반의 nodejs-express 설정하기
이글을 작성하게 되는 순간이 이렇게 빨리 올줄은 몰랐다.
사실 난 직장에서 nodejs를 이용한 프론트앤드 개발을 하고 있다.
spa로 만든 사이트를 운영유지보수 한다고 해서 싱글웹페이지 하고? 거창하다고 생각하고 재밌겠다 하고 들어와 봤지만 막상하는 일은 그리 대단한 우수한 프레임워크를 다루는것도 아니였다.
잠깐 아키텍처를 설명하고 본론으로 들어갈까 한다.
nodejs 언어를 기반으로 하는 express 프레임워크를 사용했다. 원래는 javascript 기반의 프레임워크 인데 대규모 프로젝트라고 타입을 쓰는 타입스크립트 기반으로 수정해서 프로젝트를 운영하고 있었다. 타입스크립트 왠지 멋져 보이고 화려해 보였다. 그럴싸 해보였다. 이게 빌드할때 문제점을 다 잡아줄까? 라는 의구심이 먼저 들었다.
막상 운영을 하는 내 입장에서 문제점들이 속속 나왔다. 일단 빌드 속도가 너무 느리다. 타입스크립트를 컴파일 하고 나서 자바스크립트로 변환후 자바스크립트 기반의 코드를 node 명령어를 이용해서 서버를 올리기 때문에 그런것 같았다. 두번째는 디버깅 문제이다. 제 아무리 설정을 잘 했다고 해도... 자바처럼 중단점을 찍어가면서 쾌적한 환경에서 하기에는 무리였다. 궁합이 안맞다고 해야 하나? 결국 visual studio code를 난 썼는데 매번 디버깅을 위해서 alert이나 console.log에 의지 해야 했다. 이게 무슨 구석기 말도 아니고 ... 심하다.
암튼 그렇게 꾸역꾸역 빌드를 성공하고 웹을 띄우면 runtime때 가끔 에러를 뿌려주고 나를 놀래켜 준다. 물론 내가 테스트할때 에러가 나오면 바로 그자리에서 잡으면 되는데 꼭 배포 하고 난 후 퇴근하고 있을때 에러가 나오면 그럴땐 난감하다. 그래서 컴파일단에서 모든 에러나 버그는 잡을 수 있는 언어들이 좋다는 것에 나도 공감한다. 결국 개발은 개발언어 + 생산성 + 개발환경 + 디버깅 등이 잘되어야 개발을 원할하게 하는데 이 4궁합이 안맞으면 버리고 싶을정도로 스트레스가 밀려 온다.
이것뿐만 아니라, 나름 타입스크립트라고 tsc를 하면 타입 정의를 제대로 쓰지 않은 구간이 보이면 어김없이 에러를 뿜어내 준다. 그래서 고맙게도 그걸 수정하게 만들고 나를 지치게 만든다. 그냥 js로 가면 경고만 나오고 배포할 수 있는 코드임에도 불구하고 너무 예민하게 반응해 주는것 이것또한 걸림돌이 되었다. 마지막으로 우리는 docker로 말아서 쿠버네티스 환경에 컨테이너를 올려서 배포를 하는데 새로운 패키지를 추가하고 배포를 하면 docker build 할때 꼭 에러를 내어 주었다. 정말 이건 또 무슨 개같은일인가 하고 들여다 보았지만 역시나 원인불명이였다. 결국 나중에는 npm 이 깨져서 매번 다시 설치해 줘야 한다는 사실을 알았지만 말이다.
해당 프로젝트는 2018년도 시작해서 2019년에 끝난 프로젝트로 nodejs를 8점대를 사용하고 있다는 사실도 나를 암울하게 만들었다. 지금은 롱텀 버전이 14인데 말이다. 암울하다.
그래도 어쩌 겠는가 악조건 속에서도 우리는 꾸역꾸역 일을 해내는 대한민국의 건아들 아닌가? 어찌어찌 해서 지금 1년 가까이 운영을 순탄하게 하고 있다. 사건사고도 많았지만 그래도 배운다는 입장으로 하다보면 나름 보람을 느끼고 개운하기까지 하다. 정적 페이지 같은경우는 gulp라는걸 사용해서 압축하고 그룹별로 나눠서 파일들을 말아서 배포 하는데 이것또한 문제가 많다. 가장 큰 문제는 일단 빌드 속도 문제다.
프론트 배포하는데 왜케 속도가 오래 걸리는 것인가? 나를 괴롭게 한다.
이런 문제는 반드시 해결하고 넘어가야 한다는 사실을 명심해야 한다.
갑자기 설정에 대해서 설명할려다가 너무 삼천포로 빠진것 같아 다시 제자리로 돌아가야 겠다
간단하게 설명하고 글을 끝내려고 한다.
mkdir ts_project_app
cd ts_project_app
npm init -y
npm i -S express
npm i -D typescript
npm i -D @types/node @types/express
npx tsc --init
# tsconfig.json
{
"compilerOptions": {
"lib": ["es5", "es6"],
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
"outDir": "./build",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"sourceMap": true
}
}
# package.json
"scripts": {
"debug": "nodemon --exec ./node_modules/.bin/ts-node ./src/app.ts",
"start": "tsc && nodemon --exec node ./build/app.js",
}
# app.ts
//src/index.ts
import * as express from 'express'
const app = express();
app.get('/', (req: express.Request, res: express.Response) => {
res.send('Hello typescript 2!');
});
app.listen(3000, () => {
console.log('Example app listening on port 3000!');
});
# develop mode
npm run debug
# product mode
npm run start
요정도 적어 보고 정리할까 한다.
express 기반으로 프로젝트를 시작하면 그냥 자바스크립트로 개발할것을 권해 드리고 만약 진짜 타입스크립트로 가야 한다 라고 생각을 한다면 nest.js라는 프레임워크를 쓰는 것을 강추 드리고 싶다.
결국 이도저도 아는 프레임워크를 사용하게 되면 관리상 리스크가 너무 크기 때문에 운영하는 사람들은 죽어난다. 인터넷에 소스를 검색하고 도움을 받을려고 해도 js 형식으로 코딩된 부분들이 많아서 그걸 다시 ts로 변환하는 것도 일이라는 사실을 염두해 두고 개발 환경을 잘 선정해서 개발에 임하자.
