107일차: Main-Project Day 14 (마이페이지 API 설계)

프론트엔드쪽 코드도 어느정도 마무리가 되어가서 드디어 마이페이지 작업에 들어갔다.

 

마이페이지 구조는 아래와 같이 상단(회원 정보 조회, 회원 정보 수정 기능)과 하단(주문 내역 조회 기능)으로 나눌 수 있다.

 

 

상단에서 필요한 기능은 회원 정보를 표시하고, 정보를 수정하면 변경된 정보를 띄워주는 기능이다.

하단에서 필요한 기능은 해당 사용자의 주문 내역을 띄워주고 각 주문 내역을 누르면 세부 내용이 표시된다.

 

처음 프론트 담당자분이랑 데이터 형태를 정할때 한 페이지니까 아래와 같이 한번에 데이터를 보내는 방향으로 정했었는데

{
  “memberId”: 3,
  “memberName”: “닉네임”,
  orderInfos: [ 
    { “orderId” : 1, 
      “createdAt” : 2023-07-16 08:16:57,
      “totalPrice": 8000,
      “orderState : “SUSPENSION”,
      “orderAddress”: “~”,
      “orderProductInfos: [ {“productId": 1, "productName": “aaa”, "productImagePath": "~", "productPrice": 3000, "productCount": 1 },
                            { "productId": 2, "productName": "bbb", "productImagePath": "~", "productPrice": 5000, "productCount": 1 } ]
    },
    { “orderId” : 2, 
      "createdAt" : 2023-07-18 08:16:57,
      "orderPrice": 11000,
      “orderState : “SUSPENSION”,
      “orderAddress”: “~”,
      “orderProductInfos”: [ {"productId": 1, "productName": “aaa”, "productImagePath": "~", "productPrice": 3000, "productCount": 2 },
                             { "productId": 2, "productName": “bbb”, "productImagePath": "~", "productPrice": 5000, "productCount": 1 } ]
    } ],
  "pageInfo": { "page": 1, "size": 5, "totalElement": 2, "totalPage": 1 }
}

이럴 경우 주문내역 부분에서 다음 페이지로 넘어갈때나 회원 정보를 수정했을때에 불필요한 다른 정보를 같이 새로 가져와야하는 상황이 생겼다.

그래서 상단 / 하단의 API를 분리해서 각각 데이터를 받아오는 방향으로 변경하기로 했다.

이 방식을 사용할 경우 회원 정보에 관한 내용이 변경 혹은 추가되거나 주문 내역쪽에 변경이 생겼을때 각각 수정하면 되기때문에 유지보수가 편리해진다는 장점이 있다.

 

코드를 작성하면서 점점 "어떤게 더 합리적인 방법일까? 효율적일까?"에 대한 고민을 하게된다.

불필요한 과정을 수행하고있는건 아닌지, 더 나은 방법이 있지는 않을지 고민하고 찾아보면서 또 다양한 것들을 배우게 된다.

이제 우리 프로젝트도 거의 끝나가고있는데 남은 기간을 통해 좀 더 완성도 있는 애플리케이션을 만들고싶다.

 

[참고자료]

[질문글] 이 경우 api콜은 몇번을 하는게 합리적일까요?