프리랜스
방위산업 장비 부품 거래 플랫폼
방위산업 부품 거래를 지원하는 웹 애플리케이션으로, RDF 기반 시맨틱 웹 기술로 구현되었습니다.
기간
2024.12 ~ 2025.01
역할
프론트엔드 개발
팀 규모
2
기술 스택
ReactTypeScriptMUIViteReact QueryMobXi18nextApache2Ubuntu
프로젝트 상세 소개
KODEX2는 국방 관련 장비, 시설, 군사 정보를 RDF 기반 시맨틱 웹 기술로 제공하는 다국어(한국어/영어) 지식 플랫폼입니다. Faceted Navigation, 실시간 검색, 동적 필터링 등 고급 데이터 브라우징 기능을 제공합니다.
주요 기능
- RDF 기반 Linked Data 필터링 (Faceted Navigation)
- 동적 필터 그룹 생성
- 리스트/그리드 뷰 전환
- 리소스 상세 페이지 (탭 기반)
- 다국어 지원 (한국어/영어)
담당 업무
전체
- •KODEX2 국방 지식 플랫폼 프론트엔드 전체 구현
- •RDF/Linked Data 기반 데이터 아키텍처 설계
- •다국어(한국어/영어) 시스템 전체 구축
Faceted Navigation
- •RDF 데이터 → UI 데이터 변환 로직 구현 (564줄)
- •동적 필터 그룹 생성 (카테고리별 자동 분류)
- •MobX 기반 필터 상태 관리 (선택/해제/초기화)
- •리스트/그리드 뷰 전환 + 페이지네이션
상태 관리 아키텍처
- •MobX + React Query 하이브리드 패턴 설계
- •서버 상태(API 캐싱) / 클라이언트 상태(필터) 분리
- •Query Keys Factory 패턴으로 캐시 관리 체계화
- •staleTime 5분 설정으로 불필요한 API 호출 방지
다국어 시스템
- •이중 API 엔드포인트 구조 설계 (api_ko, api_en)
- •언어별 커스텀 훅 8개 구현 (useSearchKo/En, useFacetKo/En 등)
- •i18next 기반 파일 번역 시스템 구축
- •localStorage 언어 설정 영속화
프로젝트 구조
src/