- 고등학교 시절, 하고 싶은 일을 찾기 위해 학습에 처음으로 진지하게 임하게 되었고, 그 과정에서 꾸준함과 자기 주도성의 중요함을 체득했습니다.
- 대학교에서는 여러 사람들 앞에서 발표하는 활동을 통해 소통의 즐거움을 배웠고, 지식 공유에 흥미를 느끼게 되었습니다. 이는 개발자로서 동료와 사용자 모두와 소통하는 데 큰 자산이 되었습니다.
- VR 테마파크에서 일하면서, 기획과 프로그램 변경이 사용자 경험에 어떤 영향을 미치는지를 현장에서 체감했습니다. 이때 '사용자에 맞닿은 개발'의 중요성을 느꼈고, 프론트엔드 개발에 관심을 갖게 되었습니다.
- 이후 부트캠프에서 본격적으로 프론트엔드 기술을 익히며, 일상 속 문제를 코드로 해결하고 싶은 열망이 생겼습니다. 기술과 사람을 연결하는 개발자가 되고 싶어 더욱 몰입하게 되었고, 지금은 그 여정을 이어가고 있습니다.
Work Experience
Samil PwC AC
Team: Digital
Job: Frontend Developer
2025.01 ~ (현재)
Skills
Strong
Framework / Library
Language
State Management
Testing
Styling
CI / CD
Knowledgeable
CSS
Component Doc
Framework
Database
GTM / GA
Projects
Digital Finance
Frontend Developer (BE 2명, FE 1명 중 FE로 참여)
서비스 통합 관리 포털 서비스
React (Vite)
TypeScript
Tailwind CSS
Zustand
React Router
Axios
Tanstack Query
GitHub Actions
Docker
CRA 기반 프로젝트를 Vite로 마이그레이션하여 보안 리스크 제거 및 빌드 속도 향상
Rollup 최적화를 통해 최대 번들 크기 1200kB → 500kB로 58.3% 감소
서버 상태와 UI 상태를 분리하여 구조 안정성 및 예측 가능성 향상
기능 기반 폴더 구조로 전환하고 문서화를 통해 유지보수 효율성 향상
사내 CSP 정책 대응을 위해 react-quill-new와 커스텀 모듈 react-quill-resize로 에디터 교체 및 이미지 업로드 안정성 확보
Document AI
Web Frontend Developer (FE 2명, BE 2명 중 FE로 참여)
AI 기반 보고서 분석 솔루션
Next.js
TypeScript
Tailwind CSS
Zustand
Tanstack Query
GitHub Actions
Docker
Docker Compose
Jest
React Testing Library
Canvas API를 활용한 커스텀 PDF Viewer 구현 및 최적화
Web Worker, react-window, 코드 스플리팅으로 초기 렌더링 시간 67% 개선 (5401ms → 1780ms)
CRA 기반 프로젝트를 Vite로 마이그레이션하여 CSP 및 성능 이슈 해결
Rollup 최적화로 최대 번들 크기 1200kB → 500kB로 58.3% 감소
멀티 스테이지 빌드와 Standalone 모드 적용으로 Docker 이미지 용량 2.22GB → 195MB로 91.36% 감소
불필요한 모듈 제거 및 dynamic import로 번들 크기 302kB → 143kB로 73.5% 감소
SamilDevKit Design System
Web Frontend Developer (FE 3명 중 FE로 참여)
사내 디자인 통일성과 개발 생산성 강화를 위한 디자인 시스템 구축
Next.js
TypeScript
Tailwind CSS
Storybook
clsx, cva 도입을 주도하며 조건부 스타일링 및 클래스 네이밍 일관성 확보
반복되는 컴포넌트 패턴을 모듈화하여 재사용성 강화
ESLint, TypeScript 설정 정비 및 문서화로 개발 품질 향상 및 팀 내 코드 일관성 확보
의존성 업데이트 및 보안 취약점 대응을 통해 프로젝트 안정성 강화
순록의 편지
2024.12.02 ~ 2025.01.20
Web Frontend Developer (FE 3명 BE 1명 중 FE로 참여 )
연말에 본인과 타인에게 음성 및 글 형태로 예약 편지를 작성·전달할 수 있는 서비스
Next.js
TypeScript
Tailwind CSS
Zustand
Axios
Github-Action
MSW
GTM/GA
pnpm
AbortController를 적용해 요청 중단과 에러 관리를 체계화, 네트워크 안정성과 사용자 경험을 개선
서버 상태를 관리하는 훅으로 연결하여 개발자 경험 향상
크롬 브라우저로 전환하는 기능을 구현하여 인앱 브라우저 제약 해결
react-window를 활용해 List Virtualization 적용, 성능 최적화 및 렌더링 시간 약 80% 감소
꼼꼼
2024-07-26 ~ 2024-09-20
Web Frontend Developer (FE 4명 중 FE로 참여)
팀을 구성하고 일정을 관리하여 꼼꼼이가 되는 서비스, 부트 캠프 최종 프로젝트
Next.js
TypeScript
Tailwind CSS
Zustand
Tanstack Query
Github-Action
Storybook
GTM/GA
pnpm
zustand 기반 useOverlay 커스텀 훅을 통한 오버레이 시스템 개발
서버 액션을 활용하여 refresh token rotation을 위한 fetch 함수 구현
streaming 방식과 낙관적 업데이트, 무한 스크롤이 결합된 쿼리 관리
startTransition에 대한 이해, progress bar 구현을 통한 부드러운 상태 전환 UX 구현
급페이
2024.06.20 ~ 2024.07.07
Frontend Developer (FE 5명 중 FE로 참여)
급하게 일손이 필요한 자리에 더 많은 시급을 제공해서 아르바이트생을 구할 수 있는 서비스
Next.js
TypeScript
Tailwind CSS
Axios
Github Actions
MSW
yarn
전역 상태를 걷어내고 서버 쿠키를 활용하여 최근 본 공고 구현
알림창 무한 스크롤 mock fetching를 위한 MSW 연동
vercel CLI와 github action을 이용한 vercel organization 무료 자동 배포
