목차


해야 하는 작업

<aside>

  1. title 디자인
    1. 현재 날짜(년/월) 넣어야 함 ← date-fns 라이브러리로 format 맞추면 됨
    2. 버튼에 생성 횟수 들어가야 함 ← 생성 페이지에서 썼던 것 재탕
    3. 세 번 넘으면 알림 뜨게 함
  2. 보유한 포토카드 디자인
    1. 전체 개수 (n장)
    2. 등급별 개수 (0장일 때도 보이게는 해줘야 함)
    3. 등급별 개수 ui 색깔 다르게
  3. 공통 컴포넌트 가져옴
    1. 검색
    2. 필터 (등급/장르)
    3. 카드
    4. 페이지네이션
  4. 쿼리 문자열 처리 </aside>

api 소환

<aside> ❗

작업 끝난 뒤 코드를 정리했고, <난점과 배운 점> 항목에서 정리 전 코드와 비교할 수 있음

</aside>

export async function getMyCards(query) {
  // 쿼리 문자열 처리
  const params = new URLSearchParams();

  // refactor: 객체 구조로 받게 함
  const cleaned = { ...query, withCounts: true }; // 쿼리를 그대로 넣되, mobile 크기일 때는 count를 넣음

  Object.entries(cleaned).forEach(([key, value]) => {
    if (value && value !== 0 && value !== "") {
      params.set(key, String(value));
    }
  });

  // 반환
  const queryString = params.toString();
  return await cookieFetch(
    `/api/users/gallery${queryString && `?${queryString}`}`
  );
}

useMyGallery

<aside> ❗

작업 끝난 뒤 코드를 정리했고, <난점과 배운 점> 항목에서 정리 전 코드와 비교할 수 있음

</aside>