Form(폼) 요소에 대한 검증 및 오류 처리 개선 - 파트너스는 모든 페이지에 폼이 있고, 우린 모든 페이지를 수정해야 합니다

간단 소개

파트너스 사이트의 폼 요소 검증 및 오류 처리 개선을 통해 코드 재사용성, 유지보수성, 사용자 경험을 향상시킨 리팩토링 과정과 결과를 공유합니다.

AI Summary

폼 요소 검증 및 오류 처리 개선 배경
- 파트너스 사이트의 폼 요소 관련 코드 중복 및 유지보수 어려움 존재
- 모든 페이지에 폼이 존재하여 대규모 리팩토링 필요
- 공통 컴포넌트 제작을 통해 코드 재사용성 및 개발 효율성 향상 목표
리팩토링 과정 및 결과
- Formik 라이브러리 유지, 기존 클래스형 컴포넌트 환경 고려
- 공통 로직 모듈화 및 합성 컴포넌트(Definition) 도입으로 코드 가독성 및 유지보수성 향상
- 에러 핸들링 로직 통합으로 일관된 오류 처리 및 사용자 경험 개선 (에러 메시지 즉시 표시)
회고 및 향후 과제
- 레거시 코드 제거를 통한 코드 개선 경험 공유
- Formik의 prop-driven 방식, 불필요한 리렌더링, 복잡한 에러 핸들링 등의 개선점 존재
- 향후 Formik 대체 가능성 염두, 공통 컴포넌트 기반으로 점진적인 개선 계획