AD3 단백질 구조 분석 플랫폼: 3D 시각화 고도화와 번들 80% 감축
Molstar/RDKit 라우트 단위 로딩과 런타임 렌더링 개선으로 과학 분야 React 플랫폼의 메인 번들을 32MB에서 6.5MB로 줄이고, 두 개의 대형 시각화 라이브러리를 온디맨드 로딩으로 전환한 과정.
프론트엔드 성능, WebGL/WASM 시각화, 배포 파이프라인 — 재현 가능한 형태로 문서화한 프로덕션 엔지니어링 케이스 스터디.
바이오테크 / AI 신약 개발
Molstar/RDKit 라우트 단위 로딩과 런타임 렌더링 개선으로 과학 분야 React 플랫폼의 메인 번들을 32MB에서 6.5MB로 줄이고, 두 개의 대형 시각화 라이브러리를 온디맨드 로딩으로 전환한 과정.
OpenSeadragon 기반 WSI(Whole Slide Image) 뷰어·인터랙션 UI를 개발하고, 의료기관 온프레미스 납품에 앞서 OWASP ZAP으로 인증 플로우를 점검하는 절차를 만든 과정.
항체-약물 접합체(ADC) 데이터 플랫폼에 Molstar·RDKit 기반 3D 단백질/2D 화학구조 뷰어를 구현하고, Claude Code 기반 Playwright E2E 테스트 자동 생성 워크플로우를 도입한 과정.
세 코드베이스의 Jenkins 파이프라인 정의를 중앙 저장소 하나로 모아 스테이지 구조를 통일하고, E2E를 Cypress에서 Playwright로 전면 이관해 350개 테스트를 CI에서 자동 실행하도록 만든 과정.
HR 테크 / 채용 플랫폼
Next.js 14 Standalone 빌드와 pnpm 마이그레이션으로 Docker 이미지를 1.3GB에서 500MB로, 배포 시간을 15분에서 3분 이내로 줄인 과정.
백엔드 API 개발 전 MSW 목업으로 프론트엔드를 선행 개발한 Next.js 14 기반 채용 서비스와 관리자 페이지, next-translate 기반 다국어 SSG 페이지.
제조 / 스마트팩토리
ApexCharts·Plotly 기반 차트로 해외 생산 공장의 AOI 공정 데이터를 시각화한 모니터링 대시보드. Figma 설계부터 React 화면 구현까지 맡고 기존 Spring Boot API를 요구에 맞게 수정해, AOI 불량률을 약 20% 낮춘 과정.
패션 / 미디어 스타트업
밀라노 소재 스타트업의 정적 HTML 사이트를 Vue.js/Vuetify 기반으로 재구축하고, 외주 프리랜서 개인 명의로 있던 도메인과 호스팅을 회사 계정으로 이관한 프로젝트.
DevOps / 클라우드 인프라
GitHub → Jenkins 빌드 → GHCR push → GitOps 저장소 업데이트 → ArgoCD를 통한 K3s 클러스터 배포까지 완전 자동화한 CI/CD 파이프라인.
인터랙티브 WebGL 씬, 매크로 키보드 컨트롤, Panda CSS, 그리고 Jenkins부터 K3s까지 이어지는 완전한 CI/CD 파이프라인을 갖춘 이중언어 3D 포트폴리오 사이트.