손호영

• 통합 교육 플랫폼 신규 구축

  • SURF-LAB 학습자용 USER 서비스와 교육 운영용 ADMIN 시스템의 초기 구조와 페이지 흐름을 설계했습니다.
  • 과정 생성, 교육생 배정, 모듈 편성, 학습 모니터링, 시험 분석, 성적·진도율 관리와 수료증 발급까지 교육 운영 전 과정을 구현했습니다.

• 공통 UI와 애플리케이션 구조 표준화

  • PageTemplate, StepperPageTemplate, DetailTemplate과 공통 보드 컴포넌트를 설계해 관리자 화면의 구성 방식을 표준화했습니다.
  • USER·ADMIN·shared 패키지를 모노레포로 통합하고 공통 로직과 UI를 분리해 애플리케이션 간 구조와 개발 방식을 일관되게 정리했습니다.

• 안정적인 인증 및 데이터 처리 체계 구축

  • JWT 만료 감지와 자동 갱신, 동시 갱신 요청 병합, 다중 탭 인증 상태 동기화와 갱신 실패 시 로그아웃을 포함한 인증 체계를 구축했습니다.
  • 사용자 CRUD·엑셀 일괄 등록, 학습 데이터 처리, 성적 집계와 수료증 발급 API를 구현하고 Prisma 스키마·마이그레이션과 Swagger 명세를 관리했습니다.
  • Playwright 기반 USER·ADMIN 인증 E2E 테스트 환경을 구성해 주요 인증 흐름을 검증할 수 있도록 했습니다.

• 기존 교육·대회 서비스 확장

  • CTF 플랫폼의 SSE 수신 구조를 리팩터링하고 실시간 스코어보드, 사용자·팀 통계 시각화와 운영진·참가자 간 소통 기능을 개선했습니다.
  • CSTEC 교육 서비스에 다국어 환경, PDF와 실습을 결합한 시나리오, 실시간 학습 현황, 수료증·엑셀 다운로드와 eBook 편집 기능을 확장했습니다.

• 기업 웹사이트 및 사내 개발 기반 구축

  • Next.js App Router 기반 PADO 공식 홈페이지를 개발하고 MDX 뉴스룸, 다국어 라우팅, SEO·Open Graph, 반응형 UI와 배포 환경을 구축했습니다.
  • React·Next.js 프로젝트에서 공통으로 사용할 수 있는 모노레포 템플릿과 Storybook·MSW 기반 UI 개발 환경, Git Hook 및 코드 품질 기준을 정립했습니다.

• VROOM 교육 플랫폼 개선

  • 시험, eBook, 마이페이지, 쪽지함과 학습 현황 등 핵심 도메인의 UI·기능을 설계하고 개발했습니다.
  • 수료 조건 판단 로직과 jsPDF 기반 수료증 발급 기능을 구현했습니다.
  • Shadow DOM을 활용해 기존 Express.js 서비스와 스타일·DOM 충돌 없이 React 컴포넌트를 점진적으로 도입했습니다.
  • PandaCSS, React Query, ky와 Storybook을 적용해 컴포넌트 개발 환경과 유지보수성을 개선했습니다.

• 잇러닝 실습형 학습 플랫폼

  • Next.js 기반 SSR을 도입하고 강의·챕터·콘텐츠를 관리하는 학습 콘텐츠 편집기를 구현했습니다.
  • ToastEditor와 MonacoEditor를 커스터마이징해 Markdown과 코드 작성 경험을 개선했습니다.
  • Pyodide 코드 실행과 Docker·Xterm.js 기반 웹 터미널을 연결해 브라우저에서 실습할 수 있는 학습 환경을 구축했습니다.

• 사이버 전장 3D 시각화

  • Three.js 기반 3D Globe와 네트워크 토폴로지를 구현했습니다.
  • 노드·링크 연결 구조, 곡선 경로 애니메이션과 드래그 기반 편집 기능을 개발했습니다.
  • 보안 컨퍼런스와 내부 기술 데모를 위한 시각화 프로젝트로 전시했습니다.

건축주와 건설사의 계약을 지원하는 건축 플랫폼을 개발했습니다. 경쟁입찰 서비스와 적산 관리 어드민을 구현하고, 프로젝트 구조와 개발 환경, 온보딩 문서를 정리했습니다. 2주 단위 스프린트, 코드 리뷰와 테크톡을 기반으로 협업했습니다.

• 경쟁입찰 시스템

  • 입찰에 참여한 건설사의 견적을 비교하고 외부 건설사에 현장을 홍보하는 흐름을 개발했습니다.
  • 합성 패턴을 활용해 컴포넌트 간 prop drilling을 완화했습니다.
  • Intersection Observer 기반 커스텀 훅으로 Infinite Scroll을 구현했습니다.
  • 서비스 개선 이후 건축주와 건설사 간 계약 전환율이 25% 증가했습니다.

• 적산 데이터 파싱룰

  • Ant Design 기반 데이터 관리 UI를 구현했습니다.
  • 정규표현식을 활용해 외부 적산 데이터를 지정된 규칙에 따라 변환하고 결과를 테스트할 수 있는 기능을 개발했습니다.

• Frontend: React, Next.js, TypeScript와 Vite를 기반으로 사용자·관리자 애플리케이션과 SSR·SEO·다국어 서비스를 구현합니다.
• Architecture: 모노레포와 shared 패키지를 활용해 공통 로직과 UI를 분리하고 재사용 가능한 컴포넌트·도메인 구조를 설계합니다.
• Authentication: JWT 자동 갱신, 동시 요청 제어, 다중 탭 동기화와 API 오류 처리 계층을 구축한 경험이 있습니다.
• Backend & Data: Prisma 스키마·마이그레이션, Swagger 명세와 사용자·학습·성적·수료 관련 API를 구현합니다.
• Quality: Storybook, MSW, Playwright와 Git Hook을 활용해 UI 개발, 테스트와 코드 품질 관리 환경을 표준화합니다.
• Legacy Modernization: Shadow DOM을 활용해 기존 Express.js 서비스에 React를 점진적으로 도입한 경험이 있습니다.
• Styling: Tailwind CSS, PandaCSS, Emotion과 Styled System을 활용해 반응형 UI와 디자인 시스템을 구현합니다.