HLA-peptide association proteogenome analysis database for immuno-oncology drug development Enables researchers to explore and analyze thousands of peptides by genome annotation, HLA type, and tissue type.
1 / 4
Roles
PlanningDesignFrontendBackend
Tech Stack
Next.js 14
TypeScript
Ant Design
Tailwind CSS
Chart.js
Zod
Key Features
Multi-Filter Search: Precision search combining 8 filters including peptide type, HLA type, tissue, and gene
Statistics Dashboard: At-a-glance view of sample counts and peptide distribution by tissue via charts and body visualization
Peptide Detail Analysis: Detailed PSM data, spectrum information, and genome annotation lookup for individual peptides
Custom Column Settings: Selectively show/hide table columns based on research purpose
Sequence Pattern Search: Regex-based peptide sequence search for specific pattern exploration
Key Achievements
URL-Based State Management: Search filters and pagination managed via URL query parameters for result sharing and bookmarking
Zod Schema Validation: Runtime type validation of API response data for enhanced type safety and error handling
Complex Filter System: Dynamic form supporting dependencies and autocomplete across 8 filters
Server/Client Rendering Optimization: SSR for homepage, CSR for search tables balancing UX and SEO
Chart.js Custom Visualization: Tissue statistics visualized with horizontal/vertical bar charts in consistent brand colors
Ant Design Theme Customization: Design token-based component styling for overall UI consistency