NodeJs | Express로 서버제작

Node 사용하여 서버 구축할 때 사용

 

Express 개요

- Express는 요청을 받아들일 서버 구축을 돕고 들어오는 요청을 파싱한다(HTTP요청이 텍스트 정보이기 때문이다 JS가 아니므로 Express가 돕는다. )

- 응답을 만드는 것도 도와줌. 상태코드 설정 , 헤더와 같은 콘텐츠를 어떻게 응답할지 설정

 

 제어와 제어의 역전

제어 

라이브러리는 언제든지 코드에 결합 가능

프레임워크 - 제어의 역전

애플리케이션의 프레임워크에서 제어의 흐름을 역전시키기때문에 프레임워크의 작동원리에 따라 코드를 작성한다.

 

Express 앱

$ npm i express  

express다운

 

$ npm i express --save 

구버전 NPM에서 패키지를  package.json에 저장시 --save붙여준다.

https://expressjs.com/

Express - Node.js web application framework

 

 

 

요청 및 응답 객체

1. 두 개의 매개변수에 접근

 1) 들어오는 요청 객체

 2) 응답 객체

 

//npm 사용
const express = require("express");
const app = express(); //app 변수에 저장

app.use((req, res) => {
    console.log("WE GOT NEW REQUEST!!")
   // console.dir(req)
    /* Express가 자동으로 HTTP요청 정보를 파싱해 JavaScript객체를 만들고
 그것을 콜백의 첫 번째 인수로 전달한다.*/
  //  res.send("HELLO WE GOT YOUR REQUEST")
   // res.send({color:'red'}) //js담음
    res.send('<h1>THIS IS MYE WEB</h1>') //html담음

})


//app에서 listen 메서드 사옹해 서버 실행
app.listen(8080,()=>{
    console.log("PORT ON 8080!")
})

 

 

Express 라우팅 기초

라우팅 : 요청과 요청된 경로를 가져와 응답에 맞춰 놓는다.

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

app.get('/cat',(req,res)=>{
    /* req는 들어온 HTTP 요청을 기반으로 Express가 생성한 객체 
    res도 Express가 생성한 객체로 둘 다 콜백에 전달됨*/
    res.send('MEOWWWWW!!!')
})
app.post('/cat',(req,res)=>{
    res.send('POST CAT!!!')
})
app.get('/dog',(req,res)=>{
    res.send('OFFF!!!')
})
app.get('*',(req,res)=>{
   // 라우터가 순서대로 매치하기때문에 이 코드가 맨위로오면 계속 I DONT KNOW THAT PATH!!!'이 뜰것임 
    res.send('I DONT KNOW THAT PATH!!!')
})

//app에서 listen 메서드 사옹해 서버 실행
app.listen(8080,()=>{
    console.log("PORT ON 8080!")
})

 

Express 경로 매개 변수

app.get('/r/:subreddit',(req,res)=>{
    const {subreddit} = req.params;
    res.send(`<h1>Browsing the ${subreddit}</h1>`)
})

app.get('/r/:subreddit/:postId',(req,res)=>{
    const {subreddit,postId} = req.params;
    res.send(`<h1>${postId} the ${subreddit}</h1>`);

})

라우트에 콜론 뒤에 경로를 정의하는 문자열을 넣고 키-값 쌍이 있는 req.params를 사용하면 된다.

 

 

쿼리 문자열 작업

쿼리란 URL의 일부로 물음표 뒤에 위치하며 쿼리 문자열의 한 부분으로써 키-값쌍으로 정보 받는다

app.get('/search',(req,res)=>{
    const { q } = req.query;
    res.send(`<h1>Search result for: ${q} </h1>`)
})

app.get('/search',(req,res)=>{
    const { q } = req.query;
    if(!q){
        res.send("NOTHING FOUND ")
    }
    res.send(`<h1>Search result for: ${q} </h1>`)
})

 

Nodemon 사용한 자동 재시작

npm i -g nodemon  우선 npm 설치

폴더의 모든것을 관찰하고 있음을 알려줌

 

index.js파일에서 HOMEPAGE에서 WELCOME HOMEPAGE로 바꾸고 저장했더니 nodemon이 이를 감지하고 재시작한다.