react nodeBird 2-1 (노드 서버, express 적용하기)

 

Node js

https://nodejs.org/ko/

Node.js

  Node.js는 자바스크립트 코드를 실행하는 런타임입니다. 

back/app.js

  http는 노드에서 http라는 모듈을 적용해주기 때문에 서버구동시에는 꼭 써야됩니다. createServer 함수도 지원해주기때문에 서버설정 시에 꼭 필요합니다. listen(포트번호)를 해주면 해당 포트로 서버가 구동되기 때문에 작성해주는 것이 좋습니다. 

 

 프론트서버와 백엔드서버를 나누는 이유

  프론트엔드 서버와 백엔드 서버를 나누는 이유는 나중 대규모 서비스가 되는것을 대비하기 위함인데요.

요청이 많아지게되면 스케일링을 하게 된다.

  만약 한개의 컴퓨터에 프론트엔드 서버에 1000이라는 요청이 오고, 백엔드 서버에는 10이라는 요청이 왔다고 가정해보면, 스케일링 시에 백엔드에 불필요한 용량이 추가되는 것이므로 비효율적입니다. 그래서, 대규모 프로젝트의 경우에는 각 기능별로 서버로 나눠주는 것이 좋습니다. 특정 기능에 서버 요청이 많아지면 그 부분만 서버를 늘리는 것이 효율적입니다. 

각 기능별로 스케일링한다면 컴퓨터의 자원을 아낄 수 있다.

  따라서, 프론트 엔드의 요청이 많으면 프론트서버를, 백엔드 요청이 많으면 백엔드서버를 스케일링하게 해주는 것이 좋습니다. 

콜백함수로 명시해주면 서버가 구동중인지 아닌지 확실하게 알 수 있다.

  다시 Node로 돌아와서, server.listen(3065, () => { console.log('서버 구동중') }; }); 콜백 함수로 서버가 구동중이라는 것을 명시해주면 서버가 실행되고 있는지 확인해볼 수 있기 때문에 해주는 것이 좋습니다. 

 위 항목이 계속 반복될 것으로 보여 코드양이 많아질 것으로 예상된다. 강의에서 발췌 캡쳐.

  하지만, 기본 노드로 서버 구성 시에는 app.js의 코드의 양이 많아진다는 단점이 있습니다. 그래서, 더 깔끔하고, 구조적으로 코드를 작성할 수 있는 express를 사용합니다.

 Express로 백엔드서버 구성하기 

기본 Node.js 모습과 express 적용 모습

  express도 내부적으로 http를 사용하기 때문에 서버 구동이 가능합니다. express의 경우에는 app.get('/', (req, res)) 부분처럼 메소드('url', (req, res)으로 적어주면 됩니다. 또한, 데이터 전송은 json을 이용하여 작성해줍니다. 따라서, get 요청인 /api/posts로 들어가보면 아래 데이터들이 다 나타나는 것을 볼 수 있습니다. 

/api/posts 요청에 대한 데이터들이 보여지는 것을 볼 수 있다.

  하지만, 주소창에서 직접 입력하는 것도 get요청이라서 가능한 것이지 post, delete 요청의 경우 주소창에서 직접 입력해서는 확인해볼 수 없습니다. POSTMAN이라는 프로그램을 이용하여 post, delete 요청의 값도 확인해볼 수 있습니다. https://www.postman.com/

Postman | The Collaboration Platform for API Development

 

postman을 통해 post 메소드의 값을 확인해볼 수 있다. 

  실무에서는 주로 사용되는 메소드는

get(가져오기), post(실행하기), delete(삭제하기),

put(전체수정하기), patch(부분수정하기 ex)닉네임 수정) 

options, head(헤더만 가져오기)가 있습니다. 

 express 라우터 분리하기

back/routes/post.js

  express도 코드양이 많아지는것을 방지하기 위해서 라우터로 분리할 수 있습니다. 주소가 겹치는 코드들을 한 곳에 묶어서 분리할 수 있는데, 

  const router = express.Router();로 정의 해주고, router.post(~~~로 코드를 작성해주면 됩니다. express.Router를 이용하면 모듈식 마운팅이 가능한 핸들러를 이용할 수 있습니다. 따라서, express.Router로 쪼개고, 기본앱에서 추가를 해주면 됩니다. 

https://expressjs.com/ko/guide/routing.html

Express 라우팅

app.use로 적용만해주면 된다.

 back/app.js에서 라우터로 쪼갠 파일을 가져와주기만 하면 됩니다. 이러면, 코드양도 줄게 되고, 조금 더 깔끔하게 코드를 작성할 수 있습니다.