❓ Express
노드로 Http 서버를 만드는경우, 복잡하고 반복적인 코드를 작성하는 경우가 많다. 개발자들이 더 편리하게 서버를 개발할 수 있도록 하는 프레임워크이다.
앞서 cors는 출처가 달라도 접근 가능하게 해주는 아주 유용한 브라우저 체제인데, Header를 계속 작성해 줘야하는 번거러움이 있다.
예를들어 (HTTP 트랜잭션 해부 에서 제공하는 코드)
const http = require('http');
http.createServer((request, response) => {
const { headers, method, url } = request;
let body = [];
request.on('error', (err) => {
console.error(err);
}).on('data', (chunk) => {
body.push(chunk);
}).on('end', () => {
body = Buffer.concat(body).toString();
// 여기서부터 새로운 부분입니다.
response.on('error', (err) => {
console.error(err);
});
response.statusCode = 200;
response.setHeader('Content-Type', 'application/json');
// 주의: 위 두 줄은 다음 한 줄로 대체할 수도 있습니다.
// response.writeHead(200, {'Content-Type': 'application/json'})
const responseBody = { headers, method, url, body };
response.write(JSON.stringify(responseBody));
response.end();
// 주의: 위 두 줄은 다음 한 줄로 대체할 수도 있습니다.
// response.end(JSON.stringify(responseBody))
// 새로운 부분이 끝났습니다.
});
}).listen(8080);클라이언트의 요청을 받아서 응답을 하는 코드인데, 반복적으로 body,header,on 등을 사용해야 하는 번거러움이 있다. express 를 사용하면 대게 코드 한줄로 끝낼수 있다.
✅ 시작하기
npm install express 설치
이렇게 ↓ 코드만 작성해도 간단하게 서버를 바로 만들수가 있다.
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 on port ${port}`)
})💡 미들웨어
미들웨어를 사용하면 코드 복잡하게 .on 이나 body, cors 설정의 Head 를 반복적으로 사용할 필요없다.
핵심 메서드 : use() , json() , cors() , status(),
쓰는이유:
요청받은 것에 응답으로 매번 똑같은 코드를 작성해야한다. (node HTTP 하드코딩)
반복되고 딱봐도 복잡하다. 이럴때 간편하게 줄일수있다.
👇 express 프레임워크
use()
- 모든 요청과 응답에 적용 시키겠다 는 함수이다.
express.json()
-
json으로 파싱 하겠다는 뜻이고, 원래 body를 json 시켜서 응답해줘야하는데
bodyParser.json()를 해줘야 하는데 버전바뀌고 json() 만써도 된다.use( express.json() )하면 모든 것에 적용
express 공식문서에Enables or disables only accepting arrays and objects; when disabled will accept anything JSON.parse accepts.
-
이런 내용이 있다. 대충 보면 json은 배열과 객체만 허용하고, 그외는 disabled 해야지 허용된다 인데,
disabled 하는 설정이 {strict : false} 이다.express.json({strict:false}): 모든타입
express.json(): 배열객체만
cors()
- head 쓸 필요없이 저함수 하나로 끝
use( cors() )코드를 쓰면 모든것에 적용
status()
- HTTP 상태코드(Location Header)인데 이것을 붙여서 응답을 보내면 REST ful 하다. 즉, REST API 와 가깝다.
❗️ query & path Parameter
쿼리 파라미터
req.query : 웹에서 검색시 검색한 데이터만 필터해서 보여준다. 그럴때 사용한다.
- 브라우저가 특정값 검색을 요청하면 서버가 필터링해서 응답하는데, 브라우저에서 설정한 필터 조건값을 받아올 수 있다. 객체형태이다.
구글에 치킨검색시 url을 보면
google.com/search?q=치킨 ~~~~ 이라하는데
q=치킨 <- 이값을 가져오는데쓴다.
get google.com/search?q=치킨
console.log(req.query); // {query : "치킨"}
get school/user?name=김코딩
console.log(req.query); // {name : "김코딩"}패스 파라미터
req.params 데이터의 고유한 값을 찾을때 쓴다.
get food/list/abcdefg12
console.log(req.params) // {list: "abcdefg12"}
get food/list/abcdefg12
console.log(req.params.list) // "abcdefg12"👤 정리
- express는 요청이 백개씩 되는 수많은 서버 개발에 아주 유용하다
- 공식문서를 잘 참고하여 적절한 함수를 이용해 효율적으로 사용한다.
