프론트엔드 엔지니어
요구사항을 기반으로 예측 가능한 인터페이스와 확장에 유연한 구조를 설계합니다. React의 선언적 모델과 TypeScript의 정적 타입을 적극 활용하며, 읽기 쉬운 코드와 더 나은 추상화를 고민합니다. 생산성을 높이는 도구와 새로운 기술 흐름에 관심을 가지고, 배운 것을 공유하고 책과 글을 통해 꾸준히 성장합니다.
온보딩 문서화, 보안 관리 개선 및 AI 개발 방식 공유
신규 입사자용 온보딩 자료 구축
업무 파악 과정을 직접 문서화하여 신규 입사자를 위한 온보딩 자료를 구축했습니다.
PAT 관리 문제 개선 및 보안 점검 가이드 공유
코드 내 PAT(Personal Access Token) 관리 문제를 발견해 폐기·재발급하고, 보안 점검 가이드를 공유했습니다.
AI-Native SDLC 기반 intent 작성 방식 공유
Anthropic의 AI-Native SDLC 기반 intent 작성 방식을 사내 AI 스터디에 공유했습니다.
공정한 채용시장을 만들기 위한 레퍼런스 체크 기반 평판 조회 플랫폼
Django 기반 웹 서비스를 Next.js로 리뉴얼
백엔드·프론트엔드 역할을 분리해 개발 생산성과 프론트엔드 인력 채용 용이성을 높였습니다.
pnpm + Turborepo 모노레포 직접 제안·설계
서비스 간 코드 중복과 모듈 분리 문제를 해결하고, 비슷한 UI의 신규 서비스를 패키지 재사용으로 2주 만에 개발·배포했습니다.
확장 가능한 다단계 평판 작성 Form 시스템 설계
Form Schema를 서버에서 관리하도록 설계해 배포 없이 질문을 추가·수정할 수 있게 했고, 동적 필드에 타입 안정성을 확보해 질문 수정 소요 시간을 7일 → 1일로 단축했습니다.
Multi-Zone 도입으로 기존 서비스 영향 없이 신규 서비스 독립 개발
동일 도메인을 유지한 채 앱을 독립적으로 분리해, 사용자 경험을 해치지 않고 신규 서비스를 추가 개발했습니다.
이력서·JD·평판·면접 분석 결과를 통합해 지원자를 종합 분석하는 B2B 플랫폼
URL·SearchParams·Form을 zod 스키마로 통합 관리
애플리케이션 전반의 사용자 입력을 단일 스키마로 관리하고, 잘못된 dynamic URL 접근을 스키마 검증으로 차단해 의도하지 않은 접근을 일관되게 처리했습니다.
Base UI 기반 헤드리스 디자인 시스템 구현
Base UI를 기준으로 디자이너와 네이밍 컨벤션을 협의하며, 일관성 있고 확장 가능한 디자인 시스템을 구현했습니다.
STT 기반 답변을 바탕으로 꼬리질문을 생성하는 AI 음성 면접 서비스
1개월 내 AI 음성 면접 서비스 설계·개발·출시
기존 서비스를 모노레포로 전환하고 디자인 시스템을 재사용해 리소스를 최소화했으며, Tailwind CSS v4 기반 모노레포 디자인 시스템으로 서비스 간 UI 일관성을 확보했습니다.
백엔드 의존 없이 AI 음성 면접 기능 설계 및 구현
Vercel AI의 Provider로 OpenAI·Gemini 등 모델을 유연하게 교체 가능한 구조를 설계하고, Stream Output 스키마를 직접 설계해 응답을 안정적으로 파싱하고 다음 질문 전환 흐름을 제어했습니다. STT·TTS는 별도 API 엔드포인트 없이 Server Action으로 처리해 백엔드 리소스를 절감했습니다.
앱 개발 경험이 없는 웹 개발자들이 React Native 개발을 맡음
Expo Router 기반 File-based Routing과 NativeWind 도입
웹과 동일한 개발 구조로 구현해 웹 개발자가 RN 개발 시 겪는 러닝커브를 줄였습니다.
Fastlane + Bitrise CI/CD 환경 초기부터 직접 구성
빌드·배포 전 과정을 자동화하고, Fastfile Syntax Highlighter 패키지를 직접 개발·배포해 팀원들의 작성 편의성을 개선했습니다.
FE 1인 체제에서 유지보수와 추가 개발이 어려운 상황을 자발적으로 개선
AI 에이전트 기반 자동 변환 파이프라인 구축
기존 프로젝트를 분석해 마이그레이션 규칙을 정의하고, skills·subagent를 직접 설계해 전체 마이그레이션을 수행했습니다.
dev 서버 시작 시간 80% 감소, 빌드·배포 6분 → 2분 단축
API 및 디자인 시스템 문서화로 백엔드 개발자도 프론트엔드 기능을 추가할 수 있는 구조를 완성했습니다.
AI 코드 생성으로 증가한 미사용 코드·의존성과 중복 품질 검사 관리 비용 개선
Knip 도입으로 전체 코드 11% 감소 및 미사용 파일 157개 제거
ESLint·TypeScript 컴파일러로는 잡히지 않는 미사용 파일·exports·dependencies를 확인하고 제거했습니다.
GitHub Actions 기반 품질 검사 자동화
ESLint, Prettier, Knip, Test를 하나의 워크플로우로 묶어 PR마다 자동 실행하고, 반복적인 수동 점검 없이 품질을 검증하도록 했습니다.
아이돌 음반·굿즈·포토카드 판매 및 유저 간 직거래를 지원하는 커머스 플랫폼
GraphQL 기반 클라이언트 아키텍처 초기부터 직접 설계
React 초기 환경을 구성하고 Apollo Client와 GraphQL Generator를 도입해, 서버 상태 분리와 클라이언트 타입 자동 생성으로 타입 안전성을 확보했습니다.
재고 소진을 위한 이벤트 기획·개발로 판매율 90% 달성
럭키드로우·랜덤팩 이벤트와 Seller 서비스를 직접 기획하고, 특정 시간대 한정 판매 전략으로 판매율 90%를 달성했습니다.
코로나로 위축된 공연 시장을 온라인으로 전환하기 위한 콘서트 스트리밍 플랫폼
멀티캠 라이브 스트리밍 개발
Mux + hls.js 기반으로 세 개의 카메라를 동시 송출하고, 시청자가 다각도 시점을 직접 선택할 수 있는 멀티캠 스트리밍을 구현했습니다.
카메라 감독이 직접 운영 가능한 스트리밍 어드민 개발
OBS 키 연동과 스트림 상태 제어 기능을 어드민에서 직접 처리해, 외부 담당자가 독립적으로 운영할 수 있는 구조로 운영을 효율화했습니다.
실시간 채팅 서비스 개발
채팅·좋아요·유저 밴 기능을 포함한 실시간 채팅 서비스를 개발했습니다.
프론트엔드 전문가 코칭을 통해 설계 사고와 모듈화를 학습했습니다. 모듈화 원칙·리팩토링·전문가 패턴을 반복 학습하고, 페어코딩과 녹화 복기로 코딩 패턴을 개선하며 예측 가능하고 변경에 용이한 코드 작성 기준을 확립했습니다.
한국산업인력공단