라우팅

라우팅이란?

특정 엔드 포인트에 대한 클라이언트 요청에 서버가 응답하는 방법을 결정하는 것이다.

이때 엔드포인트는 URI(경로)와 HTTP 요청 메소드(GET, POST, PUT, DELETE 등)로 구분된 클라이언트 요청을 말한다.

Express

Express는 웹, 앱을 위해 기능을 제공하는 간결하고 유연한 Node.js 웹 애플리케이션 프레임워크이다.

간단하게 말해 Node.js를 사용해 쉽게 서버를 구성할 수 있게 만든 클래스와 라이브러리의 집합체이다.

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

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

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

위 코드는 express 홈페이지에 나와있는 시작 방법이다.
위 코드와 같이 작성하게 되면 포트 3000에 Hello Wolrd 메세지를 확인할 수 있다.

위와 같은 문법은 express 제작자가 이렇게 사용해라라고 만든 라이브러리 사용법이기 때문에 엄청난 이해와 암기보단 사용법을 익히는 데에 중점을 두도록 하자.

app.get('/', function(요청, 응답) {
  응답.sendFile(__dirname + '/index.html')
})

클라이언트가 메인페이지 방문시 html 파일을 보내는 코드이다.
send()가 아니라 sendFile('경로')를 적고, __dirname뒤에 html 파일의 경로를 적어주게 되면 메인페이지로 접속 시 html파일이 나타나게 된다.

※ 소스 코드 수정 시 매번 서버 종료 후 터미널에 node server.js를 입력해서 변경사항을 확인하는데 번거로우니

npm install -g nodemon

nodemon을 설치해 소스코드 변경 후 파일 저장 시 알아서 서버 재시작할 수 있도록 하자.

static 파일 첨부

css파일을 첨부하기 위해 link태그를 사용해도 반영이 되지 않는다.
이때 css, 이미지, js 파일들을 html 안에서 사용하고 싶으면 우선 그게 들어있는 폴더를 서버에 등록해야 한다.

app.use(express.static(__dirname + '/public'));

위 코드는 서버파일에 app.use라는 문법으로 public 폴더를 등록하게 되어 html파일 내에서 public 폴더 안에 있는 파일들을 사용할 수 있게 된다.