React와 TypeScript를 기반으로 사용자 경험과 인터랙션을 구현하는 프론트엔드 개발자입니다.
복잡한 UI를 구조적으로 설계하고, 렌더링과 상태 관리의 동작 원리를 이해하며 문제를 해결하는 과정을 좋아합니다.
최근에는 Spring을 공부하며 프론트엔드와 백엔드를 함께 이해하는 개발자를 목표로 하고 있습니다.
| 기간 | 내용 |
|---|---|
| 2022.03 ~ 2026.02 | 인하대학교 컴퓨터공학과 졸업 |
| 기간 | 내용 |
|---|---|
| 2024.06 ~ 2024.12 | 네이버 부스트캠프 웹·모바일 9기 (Basic · Challenge · Membership) |
| 2025.06.27 | INHA SW NET-ZERO Hackathon · 🥈 우수상 |
| 2025.12 ~ 2026.02 | 현대자동차그룹 Softeer Bootcamp 7기 |
장기 취준생을 위한 자기소개서 아카이빙 · 작성 · 협업 첨삭 플랫폼
2026.01 ~ 2026.02
Links
Role
- Frontend
Tech
React TypeScript Vite TailwindCSS
TanStack Query WebSocket
- contentEditable 기반 커스텀 텍스트 에디터 설계 및 구현
- OT 기반 실시간 협업 구조 설계 및 WebSocket 상태 동기화 구현
- 리뷰 마커 기반 데이터 모델 설계로 리뷰 위치 정합성 개선
- 코드 스플리팅 전략을 적용해 Lighthouse Performance 56 → 98 개선
Vanilla JavaScript 기반 React Core 구현
2024.08 ~ 2024.10 · 네이버 부스트캠프 웹·모바일 9기
Role
- Frontend
Tech
JavaScript Virtual DOM DOM API
React의 렌더링과 상태 관리 동작 원리를 이해하기 위해 Virtual DOM, Diffing, State Management를 직접 구현한 학습 프로젝트입니다.
- Tree Diffing 기반 Reconciliation 로직 구현으로 변경된 노드만 실제 DOM에 반영
- Reactive State Management를 설계하여 상태 변경 시 구독 중인 컴포넌트가 자동으로 렌더링되도록 구현
innerHTML대신 DOM API 기반 렌더링을 적용해 XSS 위험을 줄이는 안전한 업데이트 구조 구현- 브라우저 이벤트 루프와 렌더링 타이밍을 분석하며 구현 과정을 기술 블로그로 문서화
- Virtual DOM과 Reconciliation의 동작 원리를 구현 수준으로 이해
- React의 상태 전파와 렌더링 과정을 직접 설계하며 프레임워크 내부 동작에 대한 이해를 심화
- 이후
contentEditable기반 에디터 개발에서 복잡한 DOM 동기화와 렌더링 문제를 해결하는 기반 역량 확보
AI 사용에 따른 전력 소비와 탄소배출을 시각화하고, 지속 가능한 AI 활용을 제안하는 플랫폼
2025.06.27 · INHA SW NET-ZERO Hackathon
Achievement
🥈 우수상
Role
- Frontend
- UI/UX Design
Tech
Next.js JavaScript TailwindCSS React Context API WebSocket
- React 기반 프론트엔드 개발
- 서비스 UI 설계 및 프로토타입 디자인
- 사용자 흐름을 고려한 화면 구성 및 인터랙션 설계
- 팀원들과 협업하며 제한된 시간 내 서비스 MVP 구현
- 사용자 경험을 고려한 인터랙션 설계
- React 렌더링 원리와 상태 관리
- 성능 병목을 분석하고 수치로 개선하는 과정
- 구현 이유를 설명할 수 있는 코드
- 프론트엔드와 백엔드를 함께 이해하는 개발