Express 설치하기

Express란?

웹 환경이 아닌 곳에서 Javascript 언어를 사용할 수 있게 고안된 Node.js의 프레임워크 중 하나입니다. Node.js로 서버를 만드는 것보다 더 빠르게 만들 수 있도록 도와주는 친구죠 🤜🏽💥🤛🏽
JS의 프레임워크로 React, Angular, Vue등이 존재하듯이 여러개가 존재합니다. 다만 사용률을 보면 express가 압도적으로 높습니다.

https://www.npmtrends.com/express-vs-fastify-vs-hapi-vs-koa-vs-restify

이거나 저거나 차이점을 잘 모르는 초보 개발자인지라 늘 npm popular지수가 가장 높은 것을 사용하고 있습니다. (Express는 노마드코더 유튜브 클론코딩을 하며 알게 되었네요.)

Node.js란?
Javascript는 웹 브라우저에만 내장되어 있어, 브라우저 밖으로 가지고 나와 우리가 컴퓨터에서 사용할 수 있도록 해주는 소프트웨어 플랫폼
(Node.js란 무엇인가?)

Express 설치 방법

npm init
npm i express

1. 원하는 경로로 이동하여 설치를 시작합니다.

2. npm init
package.json 파일이 생성됩니다.

3. npm i express

Hello World! 작성

const express = require('express')
const app = express()
const port = 4000

app.get('/', (req, res) => {
  res.send('Hello World!')
})

app.listen(port, () => {
  console.log(`Example app listening at http://localhost:${port}`)
})

express 홈페이지의 hello world 예제 코드입니다.
파일명은 app.js, index.js 무방합니다만 저는 index.js로 파일을 생성하겠습니다.

const express = require(‘express’)
require는 node module을 가져오겠다는 의미입니다.
require(‘express’)는 설치된 node_moduels 폴더에서 express에 관한 내용을 가져옵니다.

const app = express()
express 서버를 실행시키는 함수를 app 변수에 담습니다.

app.get(’/’, ~)
사용자가 홈페이지에 접속할 때는 get과 post 2가지 방식이 있습니다. get은 URL로 접속하는 방식입니다.
홈(/)으로 'Hello world’라는 텍스트를 보냅니다. 서버 실행후 localhost:4000 으로 가면 확인할 수 있습니다.

app.listen(~)
listen이라는 메소드를 이용하여 포트명(4000)과 리스닝이 성공됬을 때 실행될 콜백 함수를 적습니다. 성공하면 콘솔창에 우리가 작성한 내용이 나오겠죠

Express 서버 실행시키기

node index.js

index.js를 저장하고 콘솔창에 입력합니다.

localhost:4000으로 가면 can not GET 이런 내용이 나온다면 정상적으로 실행된 것입니다.

연결은 됬고, root (/)경로에 표시할 것이 없다는 의미입니다.
홈 경로에 작성한 코드가 없으니 표시되는 건 없습니다.

앞으로 프로젝트를 진행하면 실행 명령어가 node index.js처럼 짧지 않습니다. 더 길어진다면 매번 치기 귀찮겠죠.
공통 실행 명령어를 작성하기 위해 package.json 파일로 이동합니다.

package.json

"scripts": {
    "start": "node index.js"
},

package.json 파일을 중앙 컨트롤 타워처럼 이용합니다!
scripts라는 entry를 만들고 작성합니다.
터미널에서 npm start를 입력하면 똑같이 실행됩니다.