백엔드에서 받아온 snake_case변수를 camelCase로 변경하기

현재 백엔드 데이터베이스가 필드 이름으로 snake_case를 사용하고 클라이언트 측 코드에서 camelCase를 사용하고 있기 때문에 DB에서 데이터를 받아와서 출력할 때 코드에서 스네이크 케이스 변수를 사용하게 되었다.

그런데 이 부분에서 클라이언트측 코드에서는 카멜케이스로 일관성이 지켜졌으면 좋겠어서 카멜케이스로 바꿔서 리턴하도록 했다.

export const fetchReserveClassInfo = async (classId: string) => {
  const { data, error }: PostgrestSingleResponse<DBReserveClassType> = await supabase
    .from('class')
    .select('class_id, category, title, location, price, image, max_people, date, time, reserved_count')
    .eq('class_id', classId)
    .single();

  if (error) {
    console.error('fetchReserveClassInfo 오류 => ', error);
    return;
  }

  // 받아온 data를 카멜케이스로 변환
  const classInfo = {
    classId: data.class_id,
    category: data.category,
    title: data.title,
    location: data.location,
    price: data.price,
    image: data.image,
    maxPeople: data.max_people,
    date: data.date,
    time: data.time,
    reservedCount: data.reserved_count
  };

  return classInfo;
};

 

따라서 DB에서 받아올때의 snake_case 변수의 반환값 타입, 클라이언트 코드에서 사용할 camelCase 변수의 타입이 두개가 필요하게 된다. 이게 맞나 싶어서 GPT한테 물어봤는데 일반적인 관행이라고 한다.

서버 측 및 클라이언트 측 데이터 처리에 대해 별도의 유형을 정의하면 
각 환경의 코딩 규칙 내에서 일관성을 유지하는 데 도움이 되며 
보다 명확한 데이터 조작 및 사용이 용이해집니다

 

 

아니면 스네이크 케이스 변수를 카멜케이스로 변환하는 유틸함수를 만들어서 사용하는 방법도 있을 것 같다