서버만들기

0. 서버란?

서버는 항상 인터넷에 열결되어있는 컴퓨터로 사용자의 요청(request)를 상시 듣고(listening)있는 컴퓨터다.

요청(request)?
사용자가 브라우저를통해 무언가를 요청하는 것
ex) 로그인id,password를 입력한 로그인요청, 뉴스 제목을 누르면 뉴스자료를 달라는 요청

서버에 요청하는것은 나의 행동을 듣는 서버에만 요청을 보낼수있기때문에 우선 서버가 어떤 port번호를 들을지를 정해줘야한다.

1. 포트번호 지정하기

const PORT = 4000;
app.listen(PORT);
//위 아래 모두 4000을 사용한다
app.listen(4000);

서버는 모든 것을 감시할 수 없기때문에 특정 부분을 계속해서 감시하려면 port가 필요하다.
port는 컴퓨터의 수많은 문중 하나라고 생각하면 된다.(

엿보기용문

)
나는 4000번 포트를 사용하였다.

그림에는 port가 다 닫혀있는거로 만들었는데 많은 port번호들이 비어있으며, 높은번호일수록 비어있다.
사용하고 싶은 포트가 사용중인지 확인하고 싶다면 lsof -i :포트번호를 입력하면 사용하고있는지 확인 할 수있다.

2. app 변수 선언하기

const app = express();

app변수에 express를 바로 사용할 수 있도록 선언해준다.

>

호이스팅 공부글 링크 넣기

app.listen(PORT, callback);

listen함수에는 callback 함수가 존재하는데, 이는 서버가 시작될때 작동하는 함수이다.

콜백함수 공부글 링크 넣기

서버가 시작될때 "server listening on port 4000"이 터미널에 나타나도록 콜백함수를 작성하였다.
터미널에 위 문장이 떠있으면 서버가 계속 돌고있으며 요청이 들어올때까지 듣고있는것이다.

---

일단 서버가 만들어졌으나 접속해보면 cannot GET/ 이라뜨면서 요청한 페이지가 없는것을 확인할 수 있다.
왜냐하면 내가 요청이 왔을때 어떻게 해야할지 정하지 않아서이다.

 

app.get()은 GET요청이 들어오면 지정된 콜백함수를 사용하여 HTTP GET요청을 지정된 경로로 라우팅한다.
(/)은 메인페이지이고, (/login)은 로그인페이지, (/detail)은 상세페이지 이런식으로 갈 곳을 알려주는것을 routing이라 한다.

위 그림은 팀원에게 설명하려고 만든것인데 강의를 들을때 택배가 떠올랐다.
현실의 택배기사분들이라면 두고가시겠지만 1명의 수령인만을위해 온 배달이고 반드시 오늘 직접 전달해야한다 가정했을때 응답이 없다면 응답을 받을때까지 한없이 기다리는것과 같지 않을까?

브라우저의 상호작용

사용자는 브라우저를 통해 request(req)를 보내고 서버는 req(요청)를 받게되는데 req를 받게되면 response(res)를 해야한다. 이것이 브라우저의 상호작용이다.
하지만 위에는 내가 res를 만들어놓지않아서 상호작용이 되지않고있다.

const handleHome = (req, res) => console.log("here is response");
app.get("/", handleHome);
//app.get("routes를 만드는 부분", controller를 만드는 부분(라우트를 어떻게 관리할 것인가에관한 함수))

응답으로 handleHome이라는 컨트롤러를 "here is response"라는 글자가 뜨도록 만들었다.

모든 controller에는 req(uest)와 res(ponse)가 있는데, express는 아래와같이 요청과 응답을 넣어준다.

handleHome({...},{...})//express의 핵심기능.

이때 응답으로 console.log(req)나 console.log(res)를 찍어주면 굉장히 많은 object정보들이 나온다.

처음 공부했을때는 '이렇게 많은걸 어디에 써..'라고 생각했었는데,
크롤링할때 res의 정보로 3항연산자를 만들어서 원하는 값을 가져왔던 기억이난다.
(니꼬샘이 "와우" 라고하셔서 왜 와우인지 느껴서 써봄)

---

서버에서 응답할것이없다면, 서버는 요청을 보낸상태로 계속 응답을 기다리게되는데
return res.end를 입력하면 아무것도 없다며 빈화면을보여주고 요청을 끝낼 수 있다.

const name = (req, res) => {
  return res.end();
};

const name = (req, res) => {
  return res.send("here is res");
};