Soomin Hwang
SYS.AUDITS // KO-KRROOT > WORKFILTER: ALL_PROJECTS
TOTAL_AUDITS:10
ENGINEERING DOSSIER

확장성·지연시간·신뢰성을 위한 설계 과정

프론트엔드 성능, WebGL/WASM 시각화, 배포 파이프라인 — 재현 가능한 형태로 문서화한 프로덕션 엔지니어링 케이스 스터디.

㈜아론티어

바이오테크 / AI 신약 개발

[ENV: ARONTIER] · 4 AUDITS
바이오테크 / AI 신약 개발
AUDIT #01

AD3 단백질 구조 분석 플랫폼: 3D 시각화 고도화와 번들 80% 감축

Molstar/RDKit 라우트 단위 로딩과 런타임 렌더링 개선으로 과학 분야 React 플랫폼의 메인 번들을 32MB에서 6.5MB로 줄이고, 두 개의 대형 시각화 라이브러리를 온디맨드 로딩으로 전환한 과정.

메인 번들
32MB6.5MB−80%
Lighthouse 성능 점수
2978+49
ReactTypeScriptViteMolstarRDKit.jsPlotlyMUI
케이스 스터디 읽기 →SYS.STATUS: VERIFIED
의료 AI / 디지털 병리
AUDIT #03

PATH 병리 이미지(WSI) 분석 플랫폼: 뷰어 개발과 납품 전 보안 점검

OpenSeadragon 기반 WSI(Whole Slide Image) 뷰어·인터랙션 UI를 개발하고, 의료기관 온프레미스 납품에 앞서 OWASP ZAP으로 인증 플로우를 점검하는 절차를 만든 과정.

납품
사내 스테이징까지의료기관 온프레미스 배포납품 완료
납품 전 보안 점검
절차 없음OWASP ZAP 기반 인증 플로우 스캔절차 도입
ReactTypeScriptJotaiReact Hook FormTanStack QueryOpenSeadragonOWASP ZAP
케이스 스터디 읽기 →SYS.STATUS: VERIFIED
바이오테크 / 항체-약물 접합체(ADC)
AUDIT #04

ADC 데이터 시각화: Next.js 16 기반 3D/2D 분자 뷰어

항체-약물 접합체(ADC) 데이터 플랫폼에 Molstar·RDKit 기반 3D 단백질/2D 화학구조 뷰어를 구현하고, Claude Code 기반 Playwright E2E 테스트 자동 생성 워크플로우를 도입한 과정.

E2E 테스트 작성
수동 스펙 작성Claude Code 기반 자동 생성워크플로우 도입
E2E 표준
제품마다 제각각 CypressAD3 28개 앱 이관의 기준이 된 Playwright 컨벤션표준 수립
ReactTypeScriptNext.js 16MolstarRDKitTailwind CSSPlaywrightClaude Code
케이스 스터디 읽기 →SYS.STATUS: VERIFIED
플랫폼 엔지니어링 / DevSecOps
AUDIT #05

하나의 파이프라인, 세 개의 제품: CI/CD와 테스트 리포팅 표준화

세 코드베이스의 Jenkins 파이프라인 정의를 중앙 저장소 하나로 모아 스테이지 구조를 통일하고, E2E를 Cypress에서 Playwright로 전면 이관해 350개 테스트를 CI에서 자동 실행하도록 만든 과정.

수동 회귀 테스트
~5시간~1시간−80%
E2E 파이프라인 정의
314줄 (Cypress)151줄 (Playwright)−52%
JenkinsGroovy (Declarative Pipeline)DockerPlaywrightSnykSonarQubeOWASP ZAP
케이스 스터디 읽기 →SYS.STATUS: VERIFIED

유한회사일루미나리안

HR 테크 / 채용 플랫폼

[ENV: ILLUMINAREAN] · 2 AUDITS
HR 테크 / 채용 플랫폼
AUDIT #06

프론트엔드 Dockerization 및 CI/CD 최적화

Next.js 14 Standalone 빌드와 pnpm 마이그레이션으로 Docker 이미지를 1.3GB에서 500MB로, 배포 시간을 15분에서 3분 이내로 줄인 과정.

Docker 이미지 용량
1.3GB500MB−62%
배포 시간
~15분3분 이내−80%
Next.js 14TypeScriptDockerJenkinspnpmGitHub Actionsnext-translate
케이스 스터디 읽기 →SYS.STATUS: VERIFIED
HR 테크 / 채용 플랫폼
AUDIT #07

채용 공고·지원자 관리 서비스 및 관리자 페이지 개발

백엔드 API 개발 전 MSW 목업으로 프론트엔드를 선행 개발한 Next.js 14 기반 채용 서비스와 관리자 페이지, next-translate 기반 다국어 SSG 페이지.

프론트엔드 착수 시점
백엔드 API 대기MSW 목업 기반 선행 개발병렬 개발
일정 리스크
순차 개발프론트/백엔드 병렬축소
Next.js 14React QueryReact Hook FormMSWDockernext-translateTailwind CSSEmotion
케이스 스터디 읽기 →SYS.STATUS: VERIFIED

㈜유라

제조 / 스마트팩토리

[ENV: YURA] · 1 AUDITS
제조 / 스마트팩토리
AUDIT #08

세르비아 생산 공장 스마트팩토리 모니터링 시스템

ApexCharts·Plotly 기반 차트로 해외 생산 공장의 AOI 공정 데이터를 시각화한 모니터링 대시보드. Figma 설계부터 React 화면 구현까지 맡고 기존 Spring Boot API를 요구에 맞게 수정해, AOI 불량률을 약 20% 낮춘 과정.

AOI 불량률
수기 집계 기준약 20% 감소−20%
공정 가시성
수기 점검대시보드 모니터링대시보드
React.jsMUIApexChartsPlotlyJava Spring BootMyBatisMariaDBFigma
케이스 스터디 읽기 →SYS.STATUS: VERIFIED

commON srl

패션 / 미디어 스타트업

[ENV: COMMON_SRL] · 1 AUDITS
패션 / 미디어 스타트업
AUDIT #09

공식 웹사이트 및 매거진 디스플레이·구매 플랫폼 개발

밀라노 소재 스타트업의 정적 HTML 사이트를 Vue.js/Vuetify 기반으로 재구축하고, 외주 프리랜서 개인 명의로 있던 도메인과 호스팅을 회사 계정으로 이관한 프로젝트.

코드베이스
정적 HTMLVue.js / Vuetify전면 재구축
도메인·호스팅
외주 프리랜서 개인 명의회사 계정으로 이전소유권 회수
Vue.jsVuetify
케이스 스터디 읽기 →SYS.STATUS: VERIFIED

개인 케이스 스터디

DevOps / 클라우드 인프라

[ENV: PERSONAL] · 2 AUDITS
DevOps / 클라우드 인프라
AUDIT #02

커밋에서 프로덕션까지: Jenkins + K3s + ArgoCD GitOps 파이프라인

GitHub → Jenkins 빌드 → GHCR push → GitOps 저장소 업데이트 → ArgoCD를 통한 K3s 클러스터 배포까지 완전 자동화한 CI/CD 파이프라인.

배포
수동 SSH5분 이내 자동완전 자동화
인프라
단일 VPSK3s 클러스터고가용성
JenkinsDockerGitHub Container RegistryK3sArgoCDGitOpsNginxTailscale
케이스 스터디 읽기 →SYS.STATUS: VERIFIED
개인 포트폴리오 / 3D 웹
AUDIT #10

몰입형 3D 포트폴리오 구축하기: Next.js 14 + React Three Fiber

인터랙티브 WebGL 씬, 매크로 키보드 컨트롤, Panda CSS, 그리고 Jenkins부터 K3s까지 이어지는 완전한 CI/CD 파이프라인을 갖춘 이중언어 3D 포트폴리오 사이트.

브라우저 3D
정적 포트폴리오 페이지인터랙티브 R3F 씬, 실서비스 중WebGL 직접 구현
파이프라인 배포
수동Jenkins → GHCR → K3s완전 자동화
Next.js 14React Three FiberThree.jsPanda CSSi18nextFramer MotionDockerJenkins
케이스 스터디 읽기 →SYS.STATUS: VERIFIED
DIRECT ENGINEERING CONTACT

더 궁금하신 것이 있으신가요?

더 다양한 정보를 원하신다면, 언제든지 연락주세요.