[BE] HTTP API 추가 절차 - innovationacademy-kr/slabs-munetic GitHub Wiki

HTTP API 구조

이 프로젝트에서 백앤드 단은 기본적으로 MVC 아키텍쳐와 유사하지만 HTTP API를 사용하므로 View 단은 생략되는 구조를 따릅니다.

HTTP 요청-응답을 처리하는 것은 다음 흐름을 따릅니다.

Untitled Diagram drawio

항목별 기능은 다음과 같습니다.

  • Browser : 브라우저의 프론트앤드 단에서 axios나 fetch를 이용해 백엔드에게 요청을 보내고 응답을 받습니다.
  • route : 백앤드 단에서 URI 및 HTTP 메소드로 구성되는 특정 엔드포인트에 대한 요청에 응답하는 방법을 결정하여 controller 미들웨어 함수를 호출합니다. express에서 제공합니다.
  • controller : express의 미들웨어 함수를 구현하는 방식으로 요청에 대한 로직을 처리합니다. DB에 대한 요청을 받을 때에는 model 객체를 받아 json 형식으로 변환해서 브라우저에게 리턴하게 됩니다.
  • service : DB와 controller 사이에서 service의 요청을 처리합니다. controller에서 service에서 정의된 함수를 호출하는 방식으로 DB에 대한 CRUD를 처리하는 로직이 들어 있습니다.
  • model : Sequelize ORM을 이용해 MariaDB 내부의 테이블을 정의하고 MariaDB와 자바스크립트 객체 간 관계를 정의합니다. 동시에 필요한 경우에 컨트롤러에게 데이터 객체의 형식도 전달하게 됩니다.

HTTP API 추가

이 프로젝트에선 빠른 구현을 위해 REST API를 구현하진 않지만 가급적 RESTful하게 URI 및 HTTP Request 메소드, 응답 코드 등을 설정하길 권장합니다. https://restfulapi.net/ 를 참조하면 도움이 될 것입니다.

  • 먼저 어떤 데이터를 담을지 구상하여 ER 다이어그램을 작성해 봅니다.
    • 기존 테이블을 사용할 경우 이 과정은 생략합니다.
  • 이후 Sequalize를 이용하여 객체와 테이블 간 관계를 정의합니다.
    • 기존 테이블을 사용할 경우 이 과정은 생략합니다.
    • 필요한 경우 외래키를 사용하여 테이블 간 관계 설정을 합니다.
    • src/models/테이블명.ts 의 위치에 정의하며 src/models/index.ts 파일에 새로 추가한 모델을 추가해야 합니다.
  • 데이터베이스에 대한 서비스를 정의합니다.
    • 예를 들면 새로운 컬럼 추가, 컬럼 조회와 같은 작업들을 의미합니다. 이 곳에서 정의된 작업들은 비동기 함수로 작성되며 서비스 단에서 호출하는 식으로 동작되게 됩니다.
    • src/service/서비스명.service.ts 의 위치에 정의합니다.
  • 컨트롤러에서 요청을 처리하고 응답의 형식 (HTTP Status Code) 및 값 (HTTP Response Body)을 정의합니다.
    • 이 함수는 express의 미들웨어 함수이므로 미들웨어 함수 양식에 맞게 작성해야 합니다.
    • 요청에 대한 처리 방법, 요청 값 읽기, 에러 상황, 응답 형식, 응답 값 등을 컨트롤러에서 정의합니다.
    • src/controller/컨트롤러명.controller.ts 의 위치에 정의합니다.
  • 요청을 처리하기 위한 URI 및 메소드를 정의합니다.
    • express의 Router 함수를 호출하여 요청 메소드, 요청 URI, URI 파라미터, 요청 시 호출할 미들웨어 함수들을 정의합니다.
    • JWT Authorization이 필요한 경우 jwt 미들웨어도 붙여야 합니다.
    • src/routes/라우트명.routes.ts 의 위치에 정의하고 나서 src/routes/index.ts 파일에 새로 추가한 라우트를 추가해야 합니다.
  • 이후 curl이나 postman 등으로 요구사항에 맞게 구현되었는지 테스트하며 새로 추가한 HTTP API에 대해 swagger API 명세를 추가합니다.