목록으로 돌아가기
면역학 연구 데이터베이스 플랫폼
면역항암제 개발을 위한 HLA-펩타이드 연관성 프로테오게놈 분석 데이터베이스
연구자들이 수천 개의 펩타이드를 게놈 주석, HLA 타입, 조직 유형별로 탐색하고 분석할 수 있도록 지원합니다.
1 / 4
담당 역할
기획디자인프론트엔드백엔드
기술 스택
Next.js 14
TypeScript
Ant Design
Tailwind CSS
Chart.js
Zod
주요 기능
- 다중 필터 검색: 펩타이드 타입, HLA 타입, 조직, 유전자 등 8가지 필터를 조합한 정밀 검색
- 통계 대시보드: 조직별 샘플 수, 펩타이드 분포를 차트와 인체 시각화로 한눈에 파악
- 펩타이드 상세 분석: 개별 펩타이드의 PSM 데이터, 스펙트럼 정보, 게놈 주석 상세 조회
- 맞춤 컬럼 설정: 연구 목적에 따라 테이블 컬럼을 선택적으로 표시/숨김
- 시퀀스 패턴 검색: 정규식 기반 펩타이드 서열 검색으로 특정 패턴 탐색
수행 업무
- URL 기반 상태 관리: 검색 필터와 페이지네이션을 URL 쿼리 파라미터로 관리하여 검색 결과 공유 및 북마크 지원
- Zod 스키마 검증: API 응답 데이터의 런타임 타입 검증으로 타입 안정성과 에러 핸들링 강화
- 복합 필터 시스템: 8개 필터 간 의존성과 자동완성을 지원하는 동적 폼 구현
- 서버/클라이언트 렌더링 최적화: 홈페이지는 SSR, 검색 테이블은 CSR로 사용자 경험과 SEO 균형
- Chart.js 커스텀 시각화: 조직별 통계를 수평/수직 바 차트로 시각화, 일관된 브랜드 컬러 적용
- Ant Design 테마 커스터마이징: 디자인 토큰 기반 컴포넌트 스타일링으로 전체 UI 일관성 확보
#바이오인포매틱스
#데이터 시각화
#연구 플랫폼
#Next.js
#검색 시스템
#과학 데이터베이스