미리보기
기본 정보
기록과 분석을 통해 지속적인 성장을 추구하는 프론트엔드 개발자입니다. 알고리즘 문제 해결 과정에서 문제 분석부터 해결까지의 과정을 체계적으로 기록하고, 더 나은 해결 방법을 도출하기 위해 꾸준히 고민합니다. 새로운 기술을 학습할 때도 구현 과정과 마주친 이슈들을 상세히 정리하는 습관이 있어, 이를 통해 기술적 성장의 발판으로 삼고 있습니다. 또한, 팀 프로젝트 경험을 통해 단순히 각자의 역할만 수행하는 것이 아닌, 효과적인 소통이 프로젝트의 성패를 좌우한다는 것을 깨달았습니다. 이를 바탕으로 팀의 생산성 향상을 위해 고민하며, 함께 성장하는 개발 문화를 만들어가는 데 기여하고자 합니다.
기술 스택
JavaScript, TypeScript, Vue.js, React, next.js13, pinia, TailwindCSS, styled-components, Figma, GitHub, JIRA, Notion, swagger, Visual Studio Code
자격증
정보처리기사
24202150192X | 한국산업인력공단
2024.09.
교육
숭신여자고등학교
고등학교 | 인문
2016.03. ~ 2019.02. | 졸업
경기대학교
대학교(학사) | 시큐리티매니지먼트학과
2019.03. ~ 2024.02. | 졸업
KB IT's Your Life 5기
사설 교육 | 풀스택 과정
2024.05. ~ 2024.10. | 졸업
프로젝트
Study With Me
팀 프로젝트
2025.01. ~ 진행 중
프로젝트 내용
[ 스터디 모임과 스터디룸을 통합적으로 관리하고 제공하는 플랫폼 ]
사용자들이 스터디를 개설하고 참여할 수 있을 뿐만 아니라, 스터디룸 공간 제공자와 이용자를 연결하여 효율적인 스터디 환경을 조성
기술 스택
TypeScript / Next.js14 / Zustand / React-Query / TailwindCSS
역할 (프론트엔드)
로그인/회원가입 페이지 UI/UX 설계 및 구현
입력 폼 유효성 검사 로직 구현
jsonwebtoken 라이브러리를 활용한 토큰 만료기한 추출
API 요청 시 토큰 유효성 검증 및 자동 갱신 로직 구현
성과 및 느낀점
토큰 기반 인증 시스템 구현 과정에서 보안 취약점을 발견하고 개선하는 경험 습득
백엔드 개발자와의 협업을 통해 효율적인 토큰 갱신 로직 구현 및 API 통신 패턴 개선
Github
F:YL(F:nd Your Life)
팀 프로젝트
2024.09. ~ 2024.10.
프로젝트 내용
[ KB 금융 데이터를 활용한 맞춤형 금융 상품 추천 및 종합 자산 관리 플랫폼 ]
사용자의 금융 현황과 니즈를 파악하여 최적화된 금융 솔루션을 제공하고, 데이터 기반의 자산 분석을 통해 효율적인 자산 관리를 지원함
기술 스택
JavaScript / Vue3 (composition API) / Pinia / TailwindCSS
역할 (프론트엔드 | 디자인 총괄)
Figma를 활용하여 UI/UX 디자인 총괄
설문 페이지 화면 구현 및 맞춤형 금융 상품 추천 기능 개발
Open AI API 프롬프팅 응답 데이터 구조 설계 백엔드 협업
사용자 체감 대기 시간 감소를 위한 로딩 애니메이션 구현
성과 및 느낀점
백엔드 개발자와의 협업을 통해 API 설계 프로세스와 효율적인 데이터 구조에 대한 이해도 향상
사용자 경험 개선을 위한 로딩 애니메이션 구현과 API 응답 최적화 과정에서 UX의 중요성 체득
실제 서비스 환경에서 발생할 수 있는 성능 이슈를 경험하고 해결 방안을 고민하는 과정 경험
Github
JUSEYO
팀 프로젝트
2024.10. ~ 2024.11.
프로젝트 내용
[ 자녀의 금융 교육과 용돈 관리를 결합한 미션 기반 교육용 금융 플랫폼 ]
부모와 자녀 간의 상호작용을 통해 책임감과 금융 이해도를 높이며, 게이미피케이션 요소를 활용하여 자녀들의 능동적인 참여를 유도함
기술 스택
TypeScript / React / Recoil / styled-component / TailwindCSS
역할 (프론트엔드)
미션 페이지 구현
미션 상태별 색상 코드 시스템 적용으로 직관성 강화
모바일 환경에 최적화된 반응형 레이아웃 구현
Shadcn UI의 재사용 가능한 컴포넌트를 활용하여 일관된 디자인 시스템 구축
성과 및 느낀점
다양한 사용자 페르소나(부모/자녀)에 따른 차별화된 UI/UX 설계 경험
컴포넌트 재사용성과 확장성을 고려한 체계적인 설계 능력 향상
TypeScript를 통해 타입 안정성의 중요성을 체감
Github
쀼의 세계
팀 프로젝트
2025.11. ~ 2025.12.
프로젝트 내용
[ 부부 간 갈등 해결을 위한 맞춤형 상담 매칭 플랫폼 ]
성향 분석을 통해 신혼/예비부부와 경험 많은 기혼부부를 연결하여, 실제 경험을 바탕으로 한 조언과 상담을 제공함
기술 스택
TypeScript / React -> Next.js / redux / styled-component / TailwindCSS
역할 (프론트엔드)
React, TypeScript 기반의 프로젝트 초기 세팅 담당
커뮤니티, 성향 분석 결과 페이지 구현
Next.js 13+ 기반 마이그레이션 환경 설정
Next.js 13+ 마이그레이션을 통한 App Router 기반 페이지 라우팅 구조 개선
성과 및 느낀점
• Next.js의 App Router 아키텍처를 통해 서버 컴포넌트와 클라이언트 컴포넌트의 분리 및 최적화 경험 습득
• 다양한 렌더링 전략(CSR, SSR, ISR)을 실제 프로젝트에 적용하며, 각 페이지의 특성에 맞는 최적화된 렌더링 방식 선택의 중요성을 이해하고 성능 향상을 경험
Github