[Node.js] Node.js 로 웹서버 환경 구축하기

하이~~

 

지난 포스팅에서 우리는 node.js 를 설치했었다. ㅎㅎ 아직 설치가 안되신 분들이라면 아래 링크를 보고 오자.

https://devkingdom.tistory.com/74

[Node.js] Node.js 설치하기

오늘은 이걸 이용해서 웹서버 환경을 한번 구축해 볼꺼다.

 

먼저 빈 디렉토리를 하나 만들어주자.

 

그리고 아래 명령어를 한번 쳐보자.

 

이러면 npm 패키지가 하나 생성될 것이다.

 

 

여기서 끝난게 아니고 package name 등을 정해줘야한다. 나는 일단 package name 이랑 description 만 작성 해주고 다른건 패스 했다. pass는 enter 키를 눌려주면된다. 

마지막 Is this OK? 라고 확인하는 것까지 yes를 입력하고 enter를 눌려주면 이제 npm project 만들기 끝 !! ㅎㅎ 

 

이렇게 하면 아래의 화면처럼 package.json 이 만들어져 있는걸 확인할 수 있다.

 

vi 명령어로 한번 열어보자. 우리가 만들었던 정보가 들어가있는걸 확인할 수 있다.

 

우리가 오늘할게 뭐라고 했지? node 기반의 webserver 환경을 만들거라고 했다. 대표적으로 사용되는 package는 바로 express 라는 모듈이다. express를 설치하자.

--save 명령어는 누군가 나중에 내가만든 이 패키지를 가져와서 사용할 수 도 있지 않겠는가? 이럴때 우리가 설치한 걸 package.json에 넣어두는 걸 의미한다. ㅎㅎ

 

 

자 이렇게 설치가 완료된 걸 볼 수 있다.

 

그러고 나면 디렉토리에 변화가 생긴 걸 볼 수 있다.

 

먼저 package.json을 다시 열어보자.

dependencies 안에 express가 생긴걸 볼 수 있다.

 

 

그리고 node_modules라는 디렉토리도 생긴걸 볼 수 있다.

 

자 이렇게 하면 express로 웹서버 환경 세팅하는게 끝났따 ㅎㅎ 굉장히 쉽지? 그러면 우리가 만든 이 express를 구동한번 시켜봐야하지 않겠는가..!

 

일단 오랜만에 코딩을 하나 해보자..!

우리가 만들었던 디렉토리 밑에 자바스크립트 파일을 하나 만들자.

위의 코드를 한줄씩 설명해보겠다. require 이라는 걸 이용해서 node_module에서 해당 키(express)에 해당하는 함수를 가져오고 그 함수를 이용해 listen을 동작시키는 아주 간단한 함수이다. 3000은 포트 번호를 의미한다. 아 그리고 위에서 작성 된 함수는 비동기 함수이다. 다들 비동기 함수가 뭔지는 아실꺼라 생각하고 설명은 생략하도록 하겠다.

 

이파일을 한번 실행시켜보자.

잘 실행되는 걸 볼 수 있다.

 

그리고 이제 웹 브라우저에서 보면 ....!!

이렇게 3000 포트로 잘 받은걸 볼 수 있다. Cannot GET / 이라고 뜨는 건 지금은 신경쓰지말자. 아직까지 서버에서 뭔가를 처릴할 방법을 내가 안해줬기 때문이다. ㅎㅎ 

 

그리고 우리가 실행했던 test.js 코드는 ctrl + c 로 간단하게 끌 수 가 있다.

그리고 우리가 자바스크립트 코드를 수정할 때 ... 매번 종료하고 실행하고 이러기가 너무 귀찮다. 하지만 node.js 에서는 파일의 변화를 감지하고 다시 재실행을 쉽게 해주는 방법이 있다.

 

아래 코드를 한번 쳐보자.

이걸 설치해주면 이제 알아서 변화를 감지하고 알아서 재실행을 해준다.. 아 그리고 이 패키지 말고 global 하게 install을 하려면 --save 대신 -g 를 쳐주면 된다. ㅎㅎㅎ

 

이렇게 까지하면 우리는 node.js 를 이용해서 웹서버 환경세팅하는걸 마쳤다.