장기보험 상담·가입 서비스

펫프렌즈의 장기보험 상담·가입 프로세스를 처음부터 설계하고 개발했습니다. 사용자가 여러 단계를 거쳐 보험에 가입하는 복잡한 플로우를 자연스럽고 안정적으로 구현하는 것이 핵심 과제였습니다.

• 다단계 보험 상담 프로세스에서 단계별 사용자 입력 데이터의 영속성 보장
• 물리적 뒤로가기 버튼과 헤더 버튼의 자연스러운 페이지 이동 흐름 구현
• 복잡한 보험 폼의 타입 안전한 유효성 검증 설계

단계별 데이터 영속성

• React Query와 Jotai persistent storage 연동으로 단계별 입력 데이터 영구 저장
• 페이지 새로고침 후에도 사용자 입력 정보 유지로 중도 이탈률 감소

커스텀 페이지 이동 훅

• replace 메서드와 이동 경로 배열을 활용한 커스텀 훅으로 단계별 이동 제어
• popstate 이벤트를 통한 물리적 뒤로가기 방지

폼 유효성 검증

• Zod를 활용한 스키마 기반 폼 유효성 검증으로 타입 안정성 및 일관된 에러 처리 확보