230208 - 서버 CRUD 실습과제

Express 프레임워크로 만든 서버로 API 문서에 정의된 요청을 수행하는 코드를 작성하는 과제를 진행했다. 

기본적인 서버의 구조로 CRUD 기능을 실습해 볼 수 있었다. 

 

1. 조회(Read)

• GET    /flight
  • 파라미터가 없을 경우 데이터에 저장된 모든 항공편을 조회
  • 추가로 사용할 수 있는 파라미터
    • departure_times(출발시간, string, 필수아님)
    • arrival_times(도착시간, string, 필수아님)
    • departure(출발지, string, 필수아님)
    • destination(도착지, string, 필수아님)
  • 응답은 배열에 담긴 객체 형태이고 JSON 형식

 

💡 req.query, req.params

클라이언트

// 클라이언트 단에서 get요청을 보냄

await axios.get(`www.test.com/post/1?title=til`)

 

서버

// 서버
// 요청 온 URL : www.test.com/post/1?title=til

router.get('/:post/:id', (req, res, next) => {
    console.log(req.params) // { post : 1 }
    console.log(req.query) // { title : til }
})

 

req.query

경로의 각 쿼리 문자열 매개 변수에 대한 속성을 포함하는 개체이다. 

 

req.params

라우터의 매개변수. 기본값은 {} 이다. 

 

 

작성한 코드

 

1. 요청온 url의 쿼리들을 구조분해 할당으로 각각의 변수에 담아준다. 이때, 파라미터가 있을수도 있고 없을수도 있기 때문에 조건문 판단이 필요하다. 

2. 조건에 맞는 데이터만 필터링하기 위해 filter 메서드의 콜백함수가 될 filterbyQuery를 작성했다. 

여러개의 조건을 판단하기 위해 pass라는 변수를 만들었다. 

데이터가 들어올때 출발-도착시간 / 출발지-도착지 형식으로 파라미터가 들어오기 때문에 파라미터가 각각 있는지, 또 데이터의 내용이 파라미터와 일치하는지를 확인해야한다. 

 

의사코드로 작성해보자면 아래와 같다. 

// 모든 조건이 일치하지 않을경우 = 파라미터가 없을경우 
// 모든 데이터가 보여야하기때문에 기본값 true
pass = true 

if (출발시간 && 도착시간) {
pass = 요소.출발시간 === (파라미터)출발시간 &&
요소.도착시간 === (파라미터)도착시간 ? true : false
// 데이터 중에서 파라미터로 들어온 출발시간과 도착시간이 모두 같은 데이터는 true 
// => filter에 의해 리턴됨 
}

if (출발지 && 도착지) {
pass = 요소.출발지 === (파라미터)출발지 && 요소.도착지=== (파라미터)도착지? true : false
// 데이터 중에서 파라미터로 들어온 출발지와 도착지가 모두 같은 데이터는 true 
// => filter에 의해 리턴됨 
}

 

결과로는 200 상태코드와 필터링된 배열을 json 형태로 응답해준다. 

 

 

 

 

2. 생성(Create)

• POST    /book
  • 클라이언트에서 예약을 생성하기 위해 사용하는 API
  • 함께 요청하는 JSON 데이터로 새로운 예약을 생성함. 
  • POST 요청 body에 포함되는 내용
    • 요청 형식 : JSON
    • MIME 타입 : application/json
      • flight_uuid(예약한 항공편 고유 아이디, string, 필수)
      • name(예약자 이름, string, 필수)
      • phone(예약자 핸드폰번호, string, 필수)
  • 응답은 배열에 담긴 객체 형태이고 JSON 형식

 

💡 UUID

UUID(universally unique identifier)는 범용 고유 식별자로서, 네트워크상에서 서로 모르는 개체들을 식별하고 구별하기 위해 사용하는 고유한 id이며 국제기구에서 표준으로 정하고 있다. UUID 표준에 따라 id를 부여하면 고유성을 완벽하ㅔㄱ 보장할수는 없지만 실제 사용상에서 중복될 가능성은 거의 없다. 32개의 16진수로 표현되며 총 36개 문자(문자 32개, 4개 하이픈)으로 된 8자리-4자리-4자리-4자리-12자리 형태의 5개 그룹으로 나누어 각각 하이픈으로 구분한다. 

 

UUID 생성법은 버전별로 여러가지가 있다. 

• v1 : 타임스탬프(시간) 기준으로 생성
• v3 : MD5 해시 기준으로 생성
• v4 : 랜덤값을 기반으로 생성. 자주사용된다. 
• v5 : SHA-1 해시 기준으로 생성

 

 

이미지에는 나와있지 않지만 let booking = [] 이라는 배열이 상단에 선언되어있다. 

POST 요청 body에 생성할 데이터가 json 형식으로 담겨서 오고, app.use(express.json())으로 미들웨어를 사용해 요청으로 오는 모든 데이터는 json 형식으로 파싱이 된다. 

create 메서드가 실행되면 예약과 관련된 데이터가 객체 형식으로 만들어지고, 이 객체가 배열 booking에 추가된다. 

데이터를 json 형식으로 파싱한 후 req.body로 요청 body를 확인할 수 있다. 

 

1. req.body를 구조분해 할당으로 필요한 변수에 값을 넣어준다. 

2. 새로 생성할 예약과 관련된 정보를 담기 위해 객체 newBook에 관련된 데이터들을 넣어준다. 

booking_uuid는 예약에서 사용할 고유 id이다. 객체의 key와 value의 이름이 같기때문에 축약형태로 작성했다. 

3. newBook을 예약 데이터인 booking에 추가하고 201 상태코드와 새로 생성된 예약 객체를 응답으로 보낸다. 

 

 

 

3. 삭제(Delete)

• DELETE    /book/{:booking_uuid}
  • 요청에 포함된 {:booking_uuid} 값과 동일한 booking_uuid 예약을 삭제
  • 응답은 객체에 삭제된 예약의 booking_uuid를 담고 JSON 형식

 

1. req.params 객체에서 구조분해할당으로 booking_uuid를 꺼내온다. 

2. filter 메서드를 사용해 booking_uuid와 일치하지 않는 데이터만 필터링하고 booking에 재할당한다. 이 경우 booking_uuid와 일치하는 데이터는 필터링되지 않기 때문에 삭제가 된다. 

3. 응답 상태코드로 204 No Content를 리턴하고, 삭제된 요소의 booking_uuid를 응답 body에 담아 보낸다. 

 

 

 

4. 수정(Update)

• PUT    /flight/{:uuid}
  • 요청에 포함된 {:uuid} 값과 동일한 uuid 값을 가진 항공편을 수정
  • PUT 요청 본문에 포함되는 내용
    • 요청 형식 : JSON
    • MIME 타입 : application/json 
      • departure_times(출발시간, string, 필수아님)
      • arrival_times(도착시간, string, 필수아님)
      • departure(출발지, string, 필수아님)
      • destination(도착지, string, 필수아님)
  • 응답은 배열에 담긴 객체 형태이고, 변경사항이 적용된 데이터를 리턴하며 JSON 형식

 

 

제일 어려웠던 내용... 

수정으로 해야할것은 두가지다. 

 

1. 요청된 uuid와 같은 값을 가진 데이터를 수정한다. 

2. 데이터가 수정이 되면 데이터 파일도 같이 수정되어야한다(파일 덮어쓰기)

 

forEach 메서드를 통해 배열 요소의 전체를 돌면서 콜백함수를 적용하게 했다. 

의사코드는 다음과 같다.

 

데이터배열.forEach((el) => {
    if (el.uuid가 요청 uuid와 같다면) {
        요청데이터에 값이 있는지 && 요소의 데이터와 요청데이터가 다른지 
        ? 다르다면 요청데이터로 바꾸기
        : 같다면 데이터를 그대로 두기 
    }

	상태코드 200으로 응답하면서 바뀐 데이터(el)를 응답하기 
})


// 데이터가 저장된 파일을 덮어쓰기 한다 
fs.writeFileSync('파일경로', '파일내용')

 

fs.writeFileSync는 동기적으로 파일을 덮어쓰기 한다. 

fs.writeFile의 경우 비동기 메서드인데, 이 메서드를 사용할경우 꼭 에러처리를 해주어야 한다. 

 

json.stringfy에는 값, json에 포함될 값 설정, 공백설정을 해줄수있다. 

값인 flights와 이 값의 모든 속성들을 json 형태로 바꿀것이기때문에 null로 설정하고, 2칸의 공백을 추가했다. 

 

 

 

이렇게해서 기본적인 서버의 CRUD를 실습해볼수있었다. 

 

 

***********************

 

https://expressjs.com/ko/4x/api.html#req.params

https://inpa.tistory.com/entry/EXPRESS-%F0%9F%93%9A-reqparams-reqquery-reqbody-%F0%9F%A4%94-%EC%A0%95%EB%A6%AC

https://choice91.tistory.com/73

https://velog.io/@tastestar/Node.js-Express-query-parameter

https://inpa.tistory.com/entry/NODE-%F0%9F%93%9A-UUID-%EB%AA%A8%EB%93%88

https://ko.wikipedia.org/wiki/%EB%B2%94%EC%9A%A9_%EA%B3%A0%EC%9C%A0_%EC%8B%9D%EB%B3%84%EC%9E%90