플러스프로젝트 배경
1) 예상 리스크 및 대응 계획 - 4개 상품 동시 재계산 시 UI 응답성 유지 — 입력 하나가 변경될 때마다 모든 상품 계산이 트리거되면 렌더링이 지연될 수 있어, React 18 useTransition으로 비긴급 업데이트를 분리하고 계산 함수를 Web Worker로 이전하는 방안을 검토할 계획입니다. - 보험 요율 테이블의 다차원 조건 분기 복잡성 — 연령대·성별·특약 조합에 따라 경우의 수가 기하급
프로젝트 성과
4개 상품 동시 비교 엔진 구조 설계
하나의 입력 조건 변경이 비교 중인 전체 상품 계산에 즉시 반영되는 동기화 구조를 Zustand + useTransition 조합으로 구현합니다.
Redis 캐시 기반 반복 계산 응답 최적화 설계
동일 조건의 반복 계산 요청을 PostgreSQL 쿼리 없이 Redis에서 응답하는 캐시 레이어를 설계하여 서버 연산 부하를 줄이는 구조를 구성합니다.
이력 재계산 폼 자동 채우기 UX 구현
이전 계산 이력의 입력 조건을 URL 쿼리 파라미터로 인코딩하여 계산기 폼을 자동 복원하는 딥링크 패턴을 구현합니다.
관리자 집계 API 서버 사이드 처리 구조 설계
GROUP BY + DATE_TRUNC 기반 PostgreSQL 집계 쿼리를 Express 레이어에서 처리하여 클라이언트 연산 부담 없는 통계 API 구조를 설계합니다.
배포 없는 상품 설정 갱신 플로우 구성
관리자 UI에서 요율 수정 시 S3 업로드 + CloudFront 캐시 무효화가 자동으로 이어지는 플로우를 구성하여 코드 변경 없이 상품 정보를 갱신할 수 있는 운영 구조를 설계합니다.
핵심 기능
멀티 상품 비교 엔진
복수의 보험 상품을 동시에 계산하여 한 화면에서 비교하는 멀티 상품 비교 엔진을 설계합니다
진행 단계
멀티 상품 비교 엔진 설계 및 상태 구조 구성
2026.04
Zustand 전역 상태와 다중 상품 비교 로직을 설계하고 비교 테이블 컴포넌트 구조를 구성합니다.
프로젝트 상세
1) 포트폴리오 소개 단일 계산기 이후 확장 로드맵으로, 멀티 상품 비교 기능·계산 이력 관리·관리자 통계 대시보드·상품 설정 관리 API를 통합한 보험 상품 비교 플랫폼 구현 데모입니다. P1 MVP에 없는 확장 기능을 중심으로 설계합니다. 2) 작업 범위 - 멀티 상품 비교 엔진: 복수의 보험 상품을 동시에 계산하여 한 화면에서 비교하는 멀티 상품 비교 엔진을 설계합니다. - 계산 이력 저장 및
