판단

• Chakra에 의존한 글로벌 컴포넌트와 서드파티 UI 라이브러리를 어떻게 정리할 것인가

  공통 디자인 시스템과 더 단순한 구현으로 대체

  Modal·Alert·Table 등은 공통 디자인 시스템의 Modal·Button 조합으로, 캐러셀은 Embla Carousel로, 스와이프는 브라우저 Pointer Events 직접 구현으로 바꿨습니다.

• Zod가 선언되지 않은 필드를 제거하는 문제를 어떻게 풀 것인가

  값을 그대로 보내야 하는 폼의 스키마를 느슨한 객체로 변경

  선언하지 않은 필드가 제출 데이터에서 빠지지 않아, API 응답 전체를 폼 값으로 쓰는 화면에서도 값이 유지됩니다.

• 폼 라이브러리 연결부를 어떻게 통일할 것인가

  입력·출력 타입이 다른 스키마도 받는 어댑터를 직접 작성

  transform으로 입력과 출력 타입이 달라지는 스키마도 받을 수 있게, 스키마를 제약 없이 받아 검증 오류를 폼 라이브러리의 오류 형식으로 변환합니다.

문제와 해결

1. 문제

   Chakra UI 기반 공통 컴포넌트와 yup 검증, 여러 서드파티 UI 라이브러리가 섞여 있어 모노레포의 다른 앱과 UI·검증 방식이 갈려 있었습니다.

   해결

   컴포넌트와 서드파티 라이브러리를 공통 디자인 시스템과 단순한 구현으로 바꾸고, 검증은 Zod 하나로 통일했습니다.

2. 문제

   Zod가 스키마에 선언되지 않은 필드를 제출 데이터에서 제거했습니다.

   해결

   값을 그대로 보내야 하는 폼의 스키마를 느슨한 객체로 바꿔 필드가 빠지지 않게 했습니다.