[JS] 초간단 http server 설치하기 (http-server 패키지)

갑자기 테스트를 해야하거나 공부할 때 작은 미니멀한 프로젝트를 만들 땐 간단한 웹서버가 필요한 경우가 있다.
npm에서 제공하는 http-server 패키지를 이용하면 시간도 단축할 수 있으며, 아주 간단한 http-server를 만들 수 있다.
라우팅을 세심하게 처리해야 한다면 express, koa 패키지를 사용하여 웹서버를 만드는 것이 바람직하다.

아파치 nginx 같은 서버를 사용할 수도 있지만, 초기설정도 매우 적고, 무엇보다 서비스 등록이 없어서 좋았다.
(그저 외부와 통신 가능한 서버, http, css, js를 간단히 사용할 필요가 있어서 사용했다.)

 

절차는 다음과 같다.

1. http-server 패키지 전역 설치 (-g)

2. npx 명령어를 이용하여 전역설치한 서버 활성화

3. http 서버 정보 및 entry 설정

http-server 패키지 전역 설치

프로젝트 폴더를 하나 만들고
http-server 모듈을 전역 설치한다.

npm install -g http-server

npx 명령어를 이용한 서버 활성화

설치가 다 되었으면 npx로 http 서버를 활성화 한다.
이때 8080 포트를 다른 프로세스가 바인드하고 있다면 오류가 발생한다.

npx http-server ./

Starting up http-server, serving ./
Available on:
  http://127.0.0.1:8080
  http://xxx.xxxx.xxx.xxx:8080
  http://xxx.xx.xxx.xx:8080

 

http 서버 정보 및 entry 설정

해당 사이트에서 옵션에 대한 더 많은 것들을 볼 수 있다.
package.json을 설정하여 간단한 명령어로 서버를 실행시켰다.

아래에 package.json 파일 scripts 블럭에 대하여 간단히 적어보았다.
옵션을 하나씩 해석하면 npx http-server 명령어로 서버를 활성화 시키고
./public entry 포인트를 설정하고 브라우저 캐시를 사용하지 않으며, 포트는 8001, 호스튼 localhost인 서버로 설정하겠다는 것이다.

"scripts": {
  "start": "npx http-server ./public -c-1 -p 8001 -a localhost"
},

VS Code 프로젝트는 다음과 같이 되어 있다. (favicon.ico는 인터넷에서 아무거나 다운받아서 사용했다)