Express.js는 Node.js로 서버를 빠르고 간편하게 만들 수 있게 도와주는 웹 프레임워크 입니다.
- Express.js 이외에 다양한 웹 프레임워크가 존재하지만 오늘날 가장 많은 Node.js 웹서버가 Express.js 프레임워크를 통해 개발되었습니다.
- 최근 각광받고 있는 Node.js의 웹 프레임워크로 Nest.js도 있습니다.
일반적인 웹 서버와 Node.js로 만든 웹 서버는 다르지 않다!
그저 어떤 도구를 사용해서 만들었나의 차이일 뿐, 동일한 기능을 수행하는 웹 서버를 만들수 있으며, 이것은 다른 언어나 도구를 이용해 만든 웹 서버도 마찬가지 입니다.
기능이 다른 웹 서버는 존재할 수 있지만 기반이 되는 개념 자체가 다른 웹 서버는 존재하지 않습니다!
웹 서버와 Express.js의 차이점
npm init -y
-y는 npm init 명령 실행시 원래는 프로젝트명이나 버전등을 물어보는데 그런 것들을 물어보지 않고 기본값으로 알아서 설정해주는 옵션
npm install express
express.js 프레임워크 설치
=> 웹서버를 작성할 준비가 완료
API Client란 개발단계에서 우리가 작성한 API의 요청을 확인하거나 테스팅 할 때 도움을 주는 툴입니다. API Client를 사용함으로 개발 속도를 높이거나 치명적인 에러를 예방하는데 도움을 받을 수 있습니다.
Postman
, Insomnia
등 여러 API Client가 있지만 이번에는 Thunder Client
를 사용할 예정.
Thunder Client
는 VS Code 안에서 사용할 수 있으면서, 기능이 부족하지 않기 때문에 비교적 쉽게 사용 할 수 있음!지금까지 우리는 HTTP Method 중 GET Method에 대응하는 API만 만들고 브라우저로 확인했습니다!
아직까진 API Client가 필요 없어보였지만 POST, PATCH, PUT, DELETE, HEAD 등의 다양한 Method에 대한 API를 개발하고 테스트하기 위해서는 반드시 필요한 도구이다.
순서
터미널 node app.js입력해서 서버를 켜줍니다.
먼저 Thunder Client 아이콘을 클릭하시고 아래와 같이 창이 나오면 New Request 버튼을 눌러줍니다.
맨위의 URI를 입력하는곳에 웹 서버 API의 HTTP Method인 GET으로 설정해 준뒤 http://localhost:3000/ 를 입력하고 Send 버튼을 눌러줍니다.
브라우저에서 보았던 “Hello World!”가 나오게 되면 성공입니다!
Query탬에서 key와 value를 넣어주면 url이 'localhost:3000/?key=value'로 변함.
body정보의 json content에 추가적인 사용자에게 정보를 줄 수 있음.
{
"user":"Hello user"
}
Collections
- 특별한 프로젝트마다 API 목록을 정리해서 사용할 수 있습니다.
- Collections는 여러가지의 API를 그룹화 시킬 수 있습니다.
Env
- 여러번 사용되는 값들을 환경변수(Environment)로 설정할 때 사용합니다.
- Token, URL, 개인 키 등 다양한 자격증명을 저장 및 사용할 수 있습니다.
Routing은 클라이언트의 요청 조건(메서드, 주소 등)에 대응해 응답하는 방식.
Router는 클라이언트의 요청을 쉽게 처리 할 수 있게 도와주는 Express.js 기본 기능중 하나
router.**METHOD**(**PATH**, **HANDLER**);
router
: express의 라우터를 정의하기 위해 사용합니다.METHOD
: HTTP Method를 나타냅니다. (ex: get, post, put, delete …)PATH
: 실제 서버에서 API를 사용하기 위한 경로를 나타냅니다.HANDLER
: 라우트가 일치할 때 실행되는 함수힙니다.웹 서버에서 요청을 받을때 가끔 모든 요청에 대해 공통적인 처리를 하고싶은 경우가 생길 수 있습니다. 그럴때 미들웨어를 이용하여 웹 서버의 요청/응답에 대해 공통적으로 관리가 가능합니다.
app.use("/api", goodsRouter);
=> 전역미들웨어로 router등록
app.use("/api", [goodsRouter, userRouter]);
=> 여러 개의 router를 가져올떄는 배열로 가져온다.
💡 모듈(Module)은
Javascript
파일 단위로 분리된 코드여기서
Javascript
파일은 특정한 기능을 가진 여러 개의 함수와 변수들의 집합.
modularize
) 됩니다.export
명령어를 변수나 함수 앞에 붙이면 외부 모듈에서 해당 변수나 함수에 접근할 수 있습니다.import
, require
명령어를 사용하면 외부 모듈의 기능을 가져올 수 있습니다.require
는 현재 학습하고 있는 CommonJS로 모듈 시스템을 관리할 때 사용합니다.import
는 ES6(ES2015)로 모듈 시스템을 관리할 때 사용합니다."type": "commonjs" //안써도 디폴트
// "type":"module" es6로 모듈관리
// 기본형
// function add(a, b) {
// return a + b;
// }
// module.exports = add; // 모듈 그 자체를 바로 add함수 할당.
// add가 객체로 됨. 따라서 run.js도 고쳐줘야함 { add : [function ()]}
// exports.add = function add(a, b) {
// return a + b; // 모듈을 호출했을때, add키값에는 (a,b){return a+b;} 익명함수가 할당됨.
// };
// 내보낼떄 객체형식으로 내보낼수도 있다.
// function add(a, b) {
// return a + b;
// }
// module.exports = {add: add}; // 모듈을 호출했을때, add키값에는 add함수가 할당됨.
// 화살표함수 이용
const add = (a, b) => {
return a + b;
}
exports.add = add; // 모듈을 호출했을떄, add키 값에는 add변수 함수가 가지고 있는 값이 할당된다.
// 기본형
// const add = require("./math.js");
// console.log(add(10, 30));
// 객체형식으로 내보내진것을 받을떄
// const add = require("./math.js");
// console.log(add.add(10, 30));
// 간단히(객체형식으로 내보내진것을 받을떄)
const {add} = require("./math.js");
console.log(add(10, 30));
- Request란 클라이언트가 서버에게 전달하려는 정보나 메시지를 담는 객체를 의미합니다.
- Response란 서버에서 클라이언트로 응답 메시지를 전송시켜주는 객체입니다.
일단 적혀있는거 다 들고 왔지만 bold체 중심으로 확인하기
req 객체
express.json()
Middleware를 이용하여야 해당 객체를 사용할 수 있습니다.res 객체
//전역미들웨어(app.use) - express.json()를 써야 request 객체 안에있는 req.body를 사용할 수 있음.(모든 코드에서 body-parser등록해서)
app.use(express.json());
//req.body
app.post("/", (req, res) => {
console.log(req.body);
res.send("기본 URI에 POST 메서드가 정상적으로 반환되었습니다.");
});
//API확인 -req.query
app.get("/", (req, res) => {
console.log(req.query);
// res.send("정상적으로 반환되었습니다.");
const obj = {
"keykey": "value입니다.",
"이름입니다." : "이름일까요?"
}
res.json(obj); // 바로 객체넣어줘도 무관
// res.status(400).json(obj); // 400에러가 난 것처럼 코드가 전달됨
});
//req.params
app.get("/:id", (req, res) => {
console.log(req.params);
res.send(":id URI정상적으로 반환되었습니다.");
});
API는 애플리케이션끼리 연결해주는 매개체이자 약속
- 웹 어플리케이션(프론트엔드)에서 원하는 기능을 수행하는 URL과 인터페이스를 제공한다는 의미
- 우리가 작성 할 API에서 원하는 데이터를 받아 데이터베이스에 데이터를 저장하고, 저장되어 있는 데이터를 읽어서 웹 어플리케이션(프론트엔드)에 데이터를 제공하는 행위를 통해 사용자가 원하는 목적을 이룰 수 있게 해야 합니다.
URL, Headers, Method 등 네트워크 표현 수단을 사람이 봐도 이해하기 쉬운 표현으로 정의한다
자원(Resource) - URL
행위 - HTTP method
Create
: 생성(POST)
Read
: 조회(GET)
Update
: 수정(PUT),(PATCH)
Delete
: 삭제(DELETE)
표현
: 보통 JSON, XML 같은 형식을 이용해서 자원을 표현
router.get('/books', (req, res) => {
res.json({ success: true, data: getAllBooks() });
});