Sapere_aude

Express 서버 기초(1) - 설치, 사용, 라우팅, static 본문

Sapere_aude_Dev개발/NodeJS 공부

Express 서버 기초(1) - 설치, 사용, 라우팅, static

톰탐톰 2023. 3. 1. 23:11

 

https://expressjs.com/

Express 배경

express는 nodejs로 만들어진 웹 프레임워크 입니다.

http 모듈을 사용하여 서버를 만들 경우 직접 많은 기능을 개발해야 합니다.

따라서 express 웹 프레임워크를 사용하여 개발시 덜 복잡하고 빠르게 서비스를 구축할 수 있습니다.

Express 설치 방법

express 설치는 아래 순서로 진행할 수 있습니다.

  1. 폴더를 만들고 해당 폴더로 이동한다.
  2. package.json생성을 위해 npm init을 실행합니다
  3. entry point를 app.js로 지정합니다.(* 다른 값으로 설정해도 상관없습니다.)
  4. npm install express

express 사용 방법

여러 동작을 실행하는 서버를 만들 수 있지만, 우선 서버가 돌아갈 수 있도록 세팅해줍니다.

// app.js
const express = require('express')
const app = express()
const port = 3000

// '/'경로로 접근시 'Hello World!'를 반환합니다.
app.get('/', (req, res) => {
res.send('Hello World!')
})

app.listen(port, () => {
console.log(Example app listening on port ${port})
})

위 파일을 실행하기 위에 node app.js를 터미널에 입력해줍니다.

http://localhost:3000/ 경로에서 결과값을 확인할 수 있습니다.

express-generator로 쉽게 시작하기

위에서의 방법대로 프로젝트를 시작하면 다른 폴더나 세팅을 직접 하나씩 진행해야합니다.

예를 들어 유저에게 제공할 html을 렌더링하는 템플릿 엔진 세팅부터 정적 폴더를 직접 세팅해야하는 것을 의미합니다.

하지만 express-generator를 사용하면 이런 과정을 단축할 수 있습니다.

// express-generator을 전역으로 설치한 후 실행합니다.
npm install -g express-generator
express

// 실행한 디렉토리 내에서 myapp이라는 폴더를 만들고 해당 프로젝트의 view-engine을 pug로 설정합니다.
express --view=pug myapp

기본적인 Routing 처리하기

라우팅이란 유저의 요청에따라 어떻게 응답할 것인지를 결정하는 것을 의미합니다.

예를 들어 “/login”경로에 GET요청을 보낸다면 서버에서는 login 페이지를 유저에게 보냅니다.

또한 “/login” 경로에 유저가 POST요청을 보낸다면 서버에서는 로그인 과정을 처리합니다.

즉 유저가 요청한 것을 서버에서 어떻게 처리할 것인지 길을 정해주는 것입니다.

GET 요청을 보내는 예시

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

POST 요청을 보내는 예시

app.post('/', (req, res) => {
  res.send('Got a POST request')
})

PUT 요청을 보내는 예시

app.put('/user', (req, res) => {
  res.send('Got a PUT request at /user')
})

DELETE 요청을 보내는 예시

app.delete('/user', (req, res) => {
  res.send('Got a DELETE request at /user')
})

정적인 파일을 제공하는 방법

요청에 대해 특정한 로직을 수행한다기 보다는 이미지 혹은 js, css등의 정적인 파일을 요청할 때 필요합니다.

생성한 app 인스턴스에 아래와 같은 설정이 필요합니다.

app.use(express.static('public'))

가상의 경로를 만들어주고 싶을때는 아래와 같은 방법으로 세팅할 수 있습니다.

// 실제 경로는 public이나 /static으로 요청이 들어왔을 때 public의 값을 꺼내줌
app.use('/static', express.static('public'))

만약 다른 폴더에서 express app을 실행한다면, 아래와 같이 절대경로를 사용하는 것이 안전합니다.

const path = require('path')
app.use('/static', express.static(path.join(__dirname, 'public')))

다음 번에는 라우팅, 미들웨어 그리고 express의 메서드를 정리하겠습니다.

 

참고 : https://expressjs.com/en/starter/installing.html

반응형
Comments