Express를 이용해 서버 만들기

Express 이용해 서버 만들기

 

순서

 

1. npm init (이 디렉토리를 하나의 패키지로 만들기 위함)

 

2. npm install express

 

 

3.

const express = require("express");

const app = express();

app.get("/hello",(req,res)=>{
    res.send("<h1>Hello Express</h1>");
});

app.listen(3000);

get메서드의 콜백함수는 route handler라고도 한다.

req : 클라이언트가 보낸 리퀘스트를 다룰 수 있음

res : 적절한 리스폰스를 보낼 수 있다.

이렇게 작성하게 되면 /hello라는 path에 대한 request가 오게되면 내 프로그램은 Hello Express라는 내용을 response의 body에 담아서 보내주게 된다.

listen이라는 메서드는 외부에서 request가 오는 것을 기다리도록 하는 메서드.

 

 

4.

const express = require("express");

const app = express();

app.get("/hello",(req,res)=>{
    res.send("<h1>Hello Express</h1>");
});

app.listen(3000,()=>{
	console.log("Server is listening...");
});

listen 메서드에 콜백함수로 서버가 외부의 request를 들을 준비가 되면 자동으로 실행되게 된다.

 

 

5. members 파일을 생성한 뒤 exports 하고 member를 app.js에 가져와준다.

//members.js

module.exports = [
  {
    id: 1,
    name: 'Alex',
    team: 'engineering',
    position: 'Server Developer',
    emailAddress: 'alex@google.com',
    phoneNumber: '010-xxxx-xxxx',
    admissionDate: '2018/12/10',
    birthday: '1994/11/08',
    profileImage: 'profile1.png',
  },
  {
    id: 2,
    name: 'Benjamin',
    team: 'engineering',
    position: 'Server Developer',
    emailAddress: 'benjamin@google.com',
    phoneNumber: '010-xxxx-xxxx',
    admissionDate: '2021/01/20',
    birthday: '1992/03/26',
    profileImage: 'profile2.png',
  },
  {
    id: 3,
    name: 'Charles',
    team: 'engineering',
    position: 'Android Developer',
    emailAddress: 'charles@google.com',
    phoneNumber: '010-xxxx-xxxx',
    admissionDate: '2018/10/09',
    birthday: '1994/09/08',
    profileImage: 'profile3.png',
  },
  {
    id: 4,
    name: 'Eric',
    team: 'engineering',
    position: 'Web Frontend Developer',
    emailAddress: 'eric@google.com',
    phoneNumber: '010-xxxx-xxxx',
    admissionDate: '2020/04/07',
    birthday: '1995/04/10',
    profileImage: 'profile4.png',
  },
  {
    id: 5,
    name: 'Danial',
    team: 'marketing',
    position: 'Marketing Manager',
    emailAddress: 'danial@google.com',
    phoneNumber: '010-xxxx-xxxx',
    admissionDate: '2021/04/21',
    birthday: '1991/07/12',
    profileImage: 'profile5.png',
  },
  {
    id: 6,
    name: 'George',
    team: 'marketing',
    position: 'Marketing Staff',
    emailAddress: 'george@google.com',
    phoneNumber: '010-xxxx-xxxx',
    admissionDate: '2020/01/06',
    birthday: '1997/02/09',
    profileImage: 'profile6.png',
  },
  {
    id: 7,
    name: 'Henry',
    team: 'marketing',
    position: 'Marketing Staff',
    emailAddress: 'henry@google.com',
    phoneNumber: '010-xxxx-xxxx',
    admissionDate: '2020/04/03',
    birthday: '1997/08/18',
    profileImage: 'profile7.png',
  },
  {
    id: 8,
    name: 'James',
    team: 'sales',
    position: 'Sales Manager',
    emailAddress: 'james@google.com',
    phoneNumber: '010-xxxx-xxxx',
    admissionDate: '2020/11/26',
    birthday: '1993/05/22',
    profileImage: 'profile8.png',
  },
  {
    id: 9,
    name: 'Kevin',
    team: 'sales',
    position: 'Sales Staff',
    emailAddress: 'kevin@google.com',
    phoneNumber: '010-xxxx-xxxx',
    admissionDate: '2020/06/19',
    birthday: '1989/06/10',
    profileImage: 'profile9.png',
  },
  {
    id: 10,
    name: 'Michael',
    team: 'sales',
    position: 'Sales Staff',
    emailAddress: 'michael@google.com',
    phoneNumber: '010-xxxx-xxxx',
    admissionDate: '2019/11/12',
    birthday: '1992/09/17',
    profileImage: 'profile10.png',
  },
];

const express = require("express");

const app = express();

let members = require("./members")

app.get("/api/members",(req,res)=>{
    res.send(members);
});

app.listen(3000, () => {
    console.log("Server is listening...")
});

배열을 send로 보내면 send가 배열을 json문자열로 변환한 결과를 response의 body에 담아 보내준다.

 

6. :id : route parameter으로 path 부분에서 가변적인 값이 전달되는 부분에 사용한다. id값에 적힌 부분을 id라는 변수에 담아준다고 생각하면 된다. 이 때 이 id값은 reqeust 객체의 params 객체의 id 값으로 설정되게 된다. (만약 :lannguage로 작성하게 되면 request 객체의 params 객체의 language값으로 설정되게 된다)

 

 

7.

const express = require("express");

const app = express();

const members = require("./members")

app.get("/api/members",(req,res)=>{
    res.send(members);
});

app.get("/api/members/:id",(req,res)=>{
    // const id = req.params.id;
    const {id} = req.params;
		const member = members.find((m)=> m.id === Number(id));
    if(member) {
        res.send(member);
    } else {
        res.status(404).send("There is no such member");
    }
});

app.listen(3000, () => {
    console.log("Server is listening...")
});

params객체의 id값을 id 라는 변수에 구조분해할당을 통해 가져오면 된다.

또한 members 객체에 있는 id값과 params에 담긴 id값을 비교해서 값이 있다면 member를 가져와야 하는데 ( 이 때 이 member 안에는 id 값이 들어가겠지, find니까) members의 id는 숫자, params의 id는 문자이므로 params의 id를 숫자형식으로 변환해주었다.

res.status(404).send("There is no such member"); 이렇게 문장 자체를 오류 메세지를 넣어줘도 되지만 나중에 response에 넣어야 할 값들을 추가하기 편하도록 JSON객체에 넣어서 보내주는 것이 좋다.

따라서 이런식으로 만들어 주는 것이 더 좋다. res.status(404).send({message : "There is no such member"})

 

 

8. 특정 팀만 조회하기

const express = require("express");

const app = express();

const members = require("./members")

app.get("/api/members",(req,res)=>{
    // const team = req.query.team;
    const {team} = req.query;
    if(team) {
        const teamMembers = members.filter((m)=> m.team === team);
        res.send(teamMembers);
    } else {
        res.send(members);
    }
});

app.get("/api/members/:id",(req,res)=>{
    // const id = req.params.id;
    const {id} = req.params;
		const member = members.find((m)=> m.id === Number(id));
    if(member) {
        res.send(member);
    } else {
        res.status(404).send("There is no such member");
    }
});

app.listen(3000, () => {
    console.log("Server is listening...")
});

query에 team 파라미터가 존재하는 경우 members의 team과 비교해서 team조건에 만족하는 사람들을 내보내고 쿼리가 존재하지 않거나 쿼리가 존재하더라도 members에 없는 팀일 경우 멤버 명단 전체를 보내주는 코드를 작성했다.

우리가 작성한 코드가 잘 들어갔는지 확인하려면

localhost:3000/api/members?team=engineering 과 같이 검색하면 된다.

 

 

참고

 

https://www.codeit.kr/dashboard