LambFerret's Blog
#1 <node.js 초보자 시작하기 : nodejs + express 설정들> 본문
필자는 웹제작 이라는 것을 별로 좋아하지 않았다. 초등학교 5학년때 인가 html 가이드 600쪽짜리 책을 사서 챕터1을 보는데 너무 어려웠다. 대체 왜 <html></html> 이라는 것을 쓸데없이 설정하고 그안에 title, body를 다 구획지어주어야 하며... 메모장에 따라해보아도 네이버같이 근사한 웹은 만들어지지않더라..
하지만 요즘은 코딩의 여러방면이 아주 간편하고 접근성이 있다. 파이썬도 있고 프론트엔드의 언어였던 자바스크립트로 백엔드도 손쉽게 할 수 있다. 나는 이중에서 웹서버인 node.js를 사용하며 있었던 개발진척, 문제점 해결방법 등을 공유하려 한다.
우선 https://nodejs.org/ko/ 에 가서 설치를 해준다. 나는 단순히 최신버전이 좋아보인다는 이유로 오른쪽의 16.7.0 버전을 받았다. 진척이 어느정도 있는 지금까지도 버전에 대해 큰 불편함은 없었다.
우선은 빈폴더를 visual studio code로 열었다.
본인은 기본 터미널 대신 git bash를 사용하였다. 역시 익숙한게 좋더라
바꾸는 법은 간단하다 컨트롤+` 를 눌러 터미널을 꺼낸 후 + 버튼을 누르면 깃배쉬가 나온다. 혹은 preference에서도 찾을 수 있는데 default terminal window 로 검색하면 나온다.
터미널에 npm init을 친다. npm은 nodejs의 설치매니저다. 그러면 여러가지 기본 세팅을 묻는데 모른다면 전부 엔터쳐도 좋다. 나는 entry point에서 이름을 server.js로 바꿨다.
이러면 package.json이 생기는데 이는 이 폴더에 대한 설명서라고 보면 편하다. 인제 여러 패키지를 깔아보자
명령어는 npm install express --save , 줄여서 npm i express 해도 된다. 옵션을 주지않으면 기본적으로 --save된다.
또한 기본 구조를 만들어주는 express-generator도 같이 깐다. 내가 이거 없이 맨폴더에 만들어보려다가 머리 쪼개질뻔했다.. 이걸 뒤늦게 알고나서 얼마나 허탈했는지 ;ㅅ;
이렇게나 도움이 되는 이친구는 옵션을 -g를 주어서 아예 컴퓨터 내 기본설정으로 만든다.
npm i express-generator -g
이후 express --view=hbs 로 만든다. view는 html 템플릿 엔진을 말하는데 크게 1. pug(=jade) 2. ejs 3. hbs(=handlebars) 가 있다.
각각 장단점이 있지만 셋중 hbs가 가독성이 좋다고 느껴서 hbs로 만들었다.
마지막으로 pm2 패키지를 깔겠다. pm2는 변경사항 저장시 웹을 껐다가 켜주는 아주 편리한 도구다. 비슷한 것으론 nodemon이 있지만 pm2를 먼저알았기에 이걸 쓰겠다.
npm i pm2
npm i
npm audit fix --force => 패키지에는 취약점이 있을 수 있기에 이 명령어로 고쳐준다.
app.js 를 키면 ..
app.js 는 실행하고 기본적 엔진만 실행해주기에 간편할수록 좋다. 따라서 기본골자는 사실 몇개 없어도 되는데 비교를 위해 다음을 보자
html배울때 사실 : <html>안녕세상!</html> 이렇게만 쳐도 만들어진다. 위 예시는 이렇게 골자만 만든것이다. 이제 터미널에 pm2 start app.js --watch를 쓴다. --watch는 저장시 서버가 껐다켜지겠다 하는 옵션이다.
나는 보통 여기 콘솔을 관리하기 위해 cmd를 열어서 pm2 monit을 친다
한쪽으로는 console.log찍히는 것을 관리해주며 vs code의 git terminal은 명령을 내리기 편하다.
이제 다음 포스트에서 express-generator에서 생긴 것들을 하나하나 살펴보도록 하겠다.
'웹 개발 > node.JS' 카테고리의 다른 글
#3 <node.js 초보자 시작하기 : Router> (0) | 2021.09.17 |
---|---|
#2 <node.js 초보자 시작하기 : express-generator (HBS)> (0) | 2021.09.17 |