시작하기에 앞서 express 공부를 시작한 이유는 현재 노마드코더 uber-eats 클론코딩을 진행하는 중 Nest.js에 대해 어려움을 겪고 있기 때문입니다. express로 백엔드에 대한 기초 지식을 공부하겠습니다.

express

공식 홈페이지에서는 express를 Node.js를 위한 빠르고 개방적인 간결한 웹 프레임워크라고 설명하고 있습니다.

간단히 말하면 express란, Node.js를 사용하여 서버를 개발하고자 하는 개발자들을 위하여 서버를 쉽게 구성할 수 있게 만든 프레임워크입니다.

설치

터미널에 npm i express 입력

사용방법

먼저 express 프레임워크를 사용하기 위해서는 require()를 사용하여 불러와야 합니다. express는 함수이며, 많은 사람들이 app 이라는 상수에 저장하여 사용합니다.

const express = require("express");
const app = express();

express에서 제공하는 listen() 함수는 서버를 시작하고 포트에 연결합니다.

app.listen(8080, () => {
  console.log("This is localhost:8080");
});

use() 함수를 통해 요청과 응답을 받을 수 있습니다. 첫 번째 매개변수는 요청, 두 번째 매개변수는 응답
localhost:8080에 요청을 보내면 res.send()에 있는 인수가 페이지에 나타납니다.

app.use((req, res) => {
  res.send("Hello Welcome to my webpage");
});

app.HTTP 메서드를 사용해서 get, post 등을 할 수 있습니다. 라우트를 생성합니다.

app.get("/", (req, res) => {
  res.send("home");
});

동적으로 라우트를 생성합니다. 리액트의 react-router-dom 라이브러리와 사용하는 방법이 유사합니다.

app.get("/cats/:breed/:Id", (req, res) => {
  const { breed, Id } = req.params;
  res.send(`Your Id : ${Id}, on the ${breed}`);
});

req 객체에는 query 특성이 있습니다. 쿼리 문자열을 기반으로 만들어진 키-값을 찾습니다.
http://localhost:8080/search?q=cat&color=green와 같이 &을 사용해 여러개의 쿼리를 받을 수 있습니다.

app.get("/search", (req, res) => {
  const { q, color } = req.query;
  res.send(`query string is ${q} and ${color}`);
});