[Node.js] Express.js 개요

Express.js가 뭐지?

express.js는 node.js의 핵심 module인 http와 connect 컴포넌트를 기반으로 하는 웹 프레임워크 이다. 이때 이 컴포넌트를 middleware 라고 한다.

웹 서비스의 동작 방식

잠깐 개념적인 부분을 짚고 넘어가보자.

CSR
Client-Side Rendering
프론트엔드에서 사용자가 페이지에서 보는 동적인 부분을 대부분 처리함
서버와의 통신은 API통신을 활용함
복잡한 프로젝트 구성, 큰 개발 사이즈에서 주로 사용함

SSR
Server-Side Rendering
백엔드에서 페이지 대부분의 영역을 처리해서 프론트엔드로 전달함
상대적으로 로딩이 느리고, 페이지 깜빡임 현상이 있음
CSR에 비해 구성이 쉽고, 작은 개발사이즈에서 사용함

Rendering
렌더링이란, 텍스트로 된 문서를 읽어내어 사용자가 볼 수 있는 웹사이트 화면을 만들어주는 과정으로, 렌더링 엔진은 HTML/CSS/JavsScript 언어를 통해 구현된다.

이 내용을 왜 다뤘냐면, 웹 서비스 동작 방식을 설명하기 위해서이다.
프론트엔드는 CSR 방식으로 클라이언트를 담당하고,
백엔드는 SSR 방식으로 서버를 담당한다.

Express.js 를 시작하는 방법

mkdir gomao-web // gomao-web 폴더를 생성
cd gomao-web // gomao-web 폴더로 이동
npm init //
npm i express

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

app.get("/", (require,response) => {
	response.send("gomao~"); // response로 "gomao~"를 전송함
})

app.listen(3000); // localhost:3000에 접속하여 express페이지 확인

Express.js 의 동작 과정

1. localhost:3000 접속
2. app.js 파일에서 app.use("/",indexRouter)
3. routes/index.js 파일에서 router.get("/",...)
4. routes/index.js 파일에서 res.render("index",...)
5. views/index.jade

????????

app routing / express routing / routing handler

app 객체 생성

var express = require("express")
var app = express()

app.use() : middleware를 사용하기 위한 함수
app.listen() : http서버를 생성해주는 함수
app.locals() : app에서 사용할 공통 상수

---

app routing

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

app.get
app.post
app.put
app.delete
app.all

----> 하지만 app 라우팅에서는 그룹화를 지원하지 않는다!!

---

express routing

app객체와 동일하게 get, put, post, delete 함수를 사용할 수 있다.

// 라우터 모듈 파일에서 라우터를 선언함.
const expresss = require("express")
const router = express.Router()
router.get("/", (req,res,next) => {
	res.send("respond : 'gomao'");
})

module.exports = router;



// app.js 파일에서 라우터를 use함수로 연결하여 사용할 수 있음.
const express = require("express")
const userRouter = require("./routes/users")
const app = express()

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

app.user("/users", userRouter)
app.listen(8080)

---

path parameter

/users/:id
/messages/:from-:to
==> 이렇게 받은 path parameter은 
router.get 함수 내에서 req.params로 받을 수 있다!

router.get("/", (req,res) => {
	const {userId}  = req.params;
    res.send(`user name : ${userId}`)
})

module.exports = router;

---

routing handler

router 혹은 app 함수의 마지막 인자에 있는 함수를 핸들러라 한다.
request(요청)를 확인하고 response(응답)를(을) 어떻게 내보낼 지 정의한다.

//////////////////////req 객체//////////////////////

.../uesrs/:id
1. req.params
 => :id 부분을 req.params.id 또는 const {id} = req.params로 읽을 수 있음.

.../path?page=2
2. req.queires
 => page 부분을 req.queires.page 로 읽을 수 있음

3. req.body
 => post 요청의 요청 데이터를 저장

4. req.get("...")
 => HTTP request의 헤더 값을 가져올 수 있음.


//////////////////////res 객체//////////////////////

1. res.send() : text 형식의 HTTP응답 전송
2. res.json() : json 형식의 HTTP응답 전송
3. res.render() : HTML Template를 사용하여 화면 전송
4. res.set() : HTTP 응답의 헤더 설정
5. res.status() : HTTP 응답의 상태 값 설정