###  잡코리아 비즈센터 구축 (PC)

**요약**

- 지원자 관리 및 채용 성과 리포트 기능을 구축하고, 복잡한 UI/상태를 구조화해 **유지보수성과 성능을 함께 개선**

**기간**

- 2025.02 ~ 2025.03 (진행중)

**아키텍처/구조**

- **FSD + DDP** 혼합 구조로 UI/도메인/데이터 계층 분리

**기술적 기여(How I improved it)**

- views/features/entities/core-data 계층 분리로 책임 경계 명확화
- Repository + Mapper + Domain Service 패턴으로 API 스키마 변경 영향 최소화
- Selection/Kanban/Table/Actions 컨텍스트 분리 및 동적 import 적용으로 복잡 상태/렌더 비용 최적화
- TanStack Query 기반 캐시 무효화/동기화 전략 설계로 목록-상세 데이터 정합성 개선
- Domain Service에서 API 응답을 UI 전용 모델로 변환하여 재사용성과 유지보수성 확보
- Vitest 기반 훅/도메인 테스트로 회귀 안정성 강화

사용 기술

- **Frontend**: React 18, Next.js, React Query(TanStack Query)
- **스타일링:** jds/theme (사내용 UI 컴포넌트), Tailwind CSS 3, vanilla-extract(병행)
- **모니터링:** Sentry
- **CI/CD**: Jenkins, Argo CD, GitLab 기반 빌드·배포 프로세스
- **Collaboration**: Notion, Slack, JIRA

역할

- 지원자 관리(ATS) 화면 복잡도 제어 (STAR)
    - **Situation / Task**
    - 칸반/테이블 2개 뷰를 동시에 운영하는 지원자 목록 화면에서, 검색·필터·정렬·페이지네이션·상세 모달 등 **상태 조합이 폭증**하여 유지보수와 성능 리스크가 커짐
    - 동일 데이터 소스를 뷰별로 안정적으로 재사용할 수 있도록 화면 상태를 4개의 Context로 분리
        - Selection
        - Kanban
        - Table
        - Actions
    - 액션(모달 닫힘/열림, 스크랩 변경, 단계 이동 등) 이후 목록-상세 정합성을 보장하도록 **TanStack Query invalidate/remove 전략**을 설계
    - 빈 상태(검색 결과 없음, 공고 자체 지원자 없음)와 예외(잘못된 공고 ID)를 분리 처리해 운영 안정성 강화
- 지원자 액션 플로우 고도화
    - 스크랩, 삭제, 면접 제안, 일괄 액션 등 실무 운영 기능을 화면 단에서 일관된 패턴으로 구현
    - 상태 반영 지연을 줄이기 위해 일부 액션은 **낙관적 업데이트 + 쿼리 동기화** 조합으로 처리
    - 상세 조회 시 열람 상태 반영, 재오픈 시 최신 데이터 보장 등
    
- 채용 리포트 도메인 구조화
    - 단일 리포트/비교 리포트를 하나의 모달 체계에서 분기 처리해 UI 재사용성 확보
    - 리포트 섹션별 데이터 변환 로직을 Domain Service로 모아
    - 화면 컴포넌트는 렌더링 역할에 집중하도록 분리
        - 처리 지표:
        - 매체별 조회수/지원자수/전환율
        - 시간대별 성과
        - 지원자 분포(연령/성별/경력/학력/희망연봉)
        - 채용 단계별 퍼널
        - 경쟁력 및 상품 성과 비교
        - 비교 리포트 인사이트 생성 로직을 분리해, 공고 간 상대 성과 해석을 UI에 일관되게 제공
- 데이터 계층 안정화(DDP)
    - Repository -> Mapper -> Domain Service -> Hook/UI 흐름으로 데이터 접근 단일화
    - API 응답 DTO와 화면 모델을 분리해 스키마 변경 시 영향 범위를 축소
    - 결과적으로 기능 추가/변경 시 화면 수정 범위를 줄이고, 회귀 리스크를 낮춤
- 성능/품질 관점 작업
    - 무거운 컴포넌트들(상세/리스트 일부)을 **dynamic import**로 분리해 초기 로딩 부담 완화
    - 훅/도메인 단 테스트(Vitest) 기반으로 핵심 로직 회귀 방지
    - ESLint/Prettier/Typecheck 파이프라인과 함께 코드 일관성 유지

잡코리아내의 기업서비스를 분리 및 리뉴얼