INTRODUCTION

---

3.0 - 2022.01.10

Your First Server

package.json 에서 index.js 실행시키는부분을 src/index.js 로 바꿔주고 src폴더 만들어서 index.js 넣어주기

index.js는 server.js 로 바꿔주기.

server.js에 import express from "express";라고해도 /node_module 에서 알아서 찾아주기 때문에 굳이 경로를 써줄 필요는 없다 알아서 node_module 밑에 express 밑에 index.js를 찾음.

1. express 어플리케이션을 만들어준다.

2. request를 받을 수 있게 listening 상태를 만들어준 다.

//2. 리스닝 상태 만들기

const handleListening = () => console.log("Server Listening on port 4000");

app.listen(4000, handleListening) //포트 , callback

한줄로줄이면

app.listen(4000, () => console.log("Server Listening on port 4000")) //포트 , callback .

이렇게 만으로도 4000포트로 리스닝 상태를 만든것이라고함.

http://localhost:4000/ 하면 아직 리스폰은 없지만 들어가짐.

^c로 종료하면 안들어가짐.

console 로그에 변수를 같이 쓰려면 작은따움표 ' 가 아닌 ` (backtick)이거를 써야함 한영끄고 ₩ 하면됨.

로그를 C+클릭 하면 바로 들어가짐.

​

2022.01.12

3.1 - GET Requests

서버 처음 만들었을때 뜨는 cannot GET /

해석 ->

GET은 HTTP method 들중의 하나이다.

HTTP는 서버가 서로 소통하는 방법인데, 내가 웹사이트에 가는것이 아니라 웹사이트가 나한테 오는것이다 (GET) == 웹사이트에 접속할 때 브라우저가 나를 어디로 데려가는 것이 아니라 나를 대신해서 웹사이트를 request하고 페이지를 가져다 주는것(GET)

/ 는 root라는 의미 (ex. google.com/ ) /뒤에있는 페이지를 GET하려고 한다.

​

2022.01.13

3.2 - GET Request part two

앱을 express한후 / 그사이에 리퀘스트(GET) 부분작성 / 후 리스닝 상태 만들기

app.get("/", () => console.log("Somebody is trying to go home")); 이 코딩과

const handleHome = () => console.log("Somebody is trying to go home")

app.get("/", handleHome);이것은 같은 의미.

​

2022.01.14

3.3 - Responses

기억해야 할 포인트는 eventListener 에는 handler가 있고, hander에는 event가 있다.

express에선, route handler 에는 event는 없지만, object 가 2개 있다.

1. request(req) object

2. response(res) object

const handlehome = (req,res) => console.log("Somebody is trying to go home")

이름은 상관없고 첫번째가 req 두번째에 들어가는게 res 인것만 알면됨. req,res 때문에 꼭 2개가 들어가야함

이두개는 express로 부터 받은것이라는걸 기억할것.

home으로 get requset 가 오면 express는 handleHomde 에다가 req 와 res를 넣어주는것임.

const handlehome = (req,res) => console.log(req);

찍어보면 req 오브젝트에 대해서 로그를 쭈우우욱 찍음. res도 마찬가지

이제 함수로 res를 종료하는걸로 줘보자.

const handlehome = (req,res) => {

return res.end();

};

더이상 로딩하지않고 끝남.

res.send(""); 는 응답메시지 보냄.

app.get("/login", handlelogin);

/login 으로 응답하나 더 만들어봄.

​

2022.01.17

3.4 - Recap

구글에 http://expressjs.com/ko/api.html#req 이런식으로 많은 express 의 속성들을 볼 수 있는 사이트가 있음.

const handlehome = (req,res) => {

// return res.end(); //그냥 끝냄

return res.send("<h1>respons message</h1>"); //;없어도 되긴하지만 꼭 넣어야함 나중에 오류날수도있음.

};

​

const handlelogin = (req,res) => {

return res.send({message: "respons login"});

};

위에 사이트에서 각 기능들 2가지정도 직접 해봄. 이번 단원은 req,res 에 대한 강조.

​

3.5 - Middlewares part One

middleware 란 middle software , 중간에 있다는 말은? req, res 사이에 있다.

모든 middleware는 handler이고 , 모든 handler 는 middleware이다

handlehome 은 controller 임. (controller 란 리턴을 해주는 곳)

const handlehome = (req,res, next)

next는 다음 실행시킬 함수임.

​

​

const gossipMiddleware = (req,res,next) => {

console.log("I'M in the middle");

next();

}

​

//1.5 get request

app.get("/", gossipMiddleware,handlehome ); ///의 의는 루트(홈) 그리고 그에대한 함수생성 /뒤에 더 붙이는데로 그 페이지 생성.

next 추가한다음 get request에서 middleware 추가 그럼 handlehome은 finalware 나 마찬가지

미들웨어에 return을 해주면 컨트롤러가 되고 미들웨어가 아니게됨. 즉 return을 해주면 next를 못씀.

미들웨어의 역할은 리턴이 아니라 이어시켜주는 역할임.

​

console.log(`Someone is going to: ${req.url}`);

위와 같이 request에 대한 url의 정보를 콘솔로그에 찍어줄 수 있음.

​

2022.01.26

3.6 - Middlewares part Two

모든 실행순서는 위에서 아래로

app.get 이든 use 든 마찬가지 그리고 한개안에 2개가 있으면 왼쪽에서 오른쪽으로

app.get("/", gossipMiddleware,handlehome );가쉽미들 웨어부터 실행하고 매들홈 실행.

​

app.use 는 모든 상황에서 사용되는 것 ( app.get 은 특정 주소값을 가져오는데 use는 전체)

const privatesite = (req,res,next) => {

if(req.url === "/private"){

return res.send("<h1>this is private</h1>");

}

next();

}

if문으로 use에서 /private라는 상황이 왔을때 만 컨트롤할 수 있게된다

​

3.7 Setup Recap

복습시간

babel-node 로 돌리는 이유는 node.js에서 실행시키지 못하는 JavaScript 까지 실행시키기 위해.

.gitignore 는 node_module 폴더 깃허브에 안올리기위함.

​

​

2022.02.03

3.8 Servers Recap

서버와 사용자의 대해 한번 더 설명해줌 ( 서버는 항상 리스닝상태, 사용자는 리퀘스트)

node_module 밑에있는 express 를 호출하는거지만 npm은 똑똑해서 바로 알아들음

import express from "express";

마우스 갖다대면 풀경로 나옴

​

​

3.9 Controllers Recap

리퀘스트에 대한 방법/ 설명

​

​

2022.02.28

3.10 Middleware Recap

미들웨어 사용

app.use : 전체적으로 사용가능log같은거 호출할때마다 복붙하는거 번거로우니까 한번에 할 수 있도록.

​

​

​

3.11 External Middlewares

미들웨어 MORGAN 설치 및 사용

morgan은 node.js 전용 request logger middleware 이다.

설치: npm i morgan

AS-IS

import express from "express";

import res from "express/lib/response";

​

const PORT =4000;

const app = express(); //1. express 어플리케이션 생성

const logger = (req,res,next) => {

console.log(` ${req.method} ${req.url}`);

next();

}

const handlehome = (req,res) => {

//return res.end(); //그냥 끝냄

return res.send("I love middleware");

//; <-없어도 되긴하지만 꼭 넣어야함 나중에 오류날수도있음.

};

// use - 전체에서 사용가능

app.use(logger);

//1.5 get request

app.get("/", handlehome ); // /의 의는 루트(홈) 그리고 그에대한 함수생성 /뒤에 더 붙이는데로 그 페이지 생성.

//2. 리스닝 상태 만들기

const handleListening = () => console.log(`erver Listening on port http://localhost:${PORT}`);

app.listen(PORT, handleListening) //포트 , callback

​

import morgan 으로 가져옴.

app.use(모르간("")) ""에 5가지 함수 있음.

combined

common

dev

short

tiny