미리보기
- 직업
- 프론트엔드 개발자
- 이름
- 변경원
- 간단소개
- 웹사이트 사용의 불편함을 느끼고 직접 제작하고 싶어 프론트엔드 개발에 관심을 가지게 되었습니다. 다양한 시각에서 문제를 분석하고 해결하는 것을 좋아하고 그 결과를 팀원과 공유하는것에 큰 즐거움을 느끼는 변경원입니다
기술 스택
- 기술 스택
- React
- TypeScript
프로젝트
- 프로젝트명
- 펄핏사이즈 B2C 웹 어플리케이션 개발
- 소속/기관명
- 스나이퍼팩토리
- 프로젝트 기간
- 2024.09. - 2024.09.
- (1개월)
- 프로젝트 설명
LLM 기반의 챗봇을 이용한 채팅 구현
사용자의 과도한 요청을 방지하기 위해 debounce 처리 적용, 비정상적인 다중 입력 방지
사용자 경험을 향상시키기 위해 이미지 업로드 시 react-image-file-resizer를 사용하여 WebP 형식으로 실시간 이미지 리사이징 및 최적화
• 이미지 크기를 줄여 전송 시간을 단축
채팅방 목록 데이터 로딩시 SkeletonUI가 대체하도록 구현
기업 제공 가이드를 바탕으로 발 측정 기능을 프로젝트에 구현
Github Action, AWS S3를 이용한 프론트엔드 CI/CD 배포
프로젝트 설명
LLM기반의 챗봇과 대화를 통해 원하는 신발을 찾는 서비스
사용 기술
React, TypeScript, Tanstack-Query, Zustand, Yarn, Vanilla-ExtractCSS, FireBase
AI 챗봇 1:1 채팅 서비스 구현
채팅 서비스 사진 업로드 리사이징 기능구현
로딩 UX 개선
내 발 측정 SDK 연동 (기업 제공 가이드 기반)
배포
- 프로젝트명
- coatycloset
- 소속/기관명
- 오즈코딩스쿨
- 프로젝트 기간
- 2024.05. - 2024.06.
- (2개월)
- 프로젝트 설명
oauth2를 이용한 소셜(카카오 , 구글, 네이버) 로그인
https://deswaq.tistory.com/60프론트에서 이미지를 빠르게 불러오기 위해 react-image-file-resizer 사용하여 이미지 최적화
웹소켓을 이용해 여러 사용자와 실시간 채팅 내용을 동기화 하는 서비스 구현
팀내 코드 일관성을 유지할 수 있도록 Eslint 규칙 설정
백엔드 API 병목으로 인하여 프로젝트 개발이 지연되는 상황을 방지하기 위하여
msw 기반의 모킹서버 활용
https://deswaq.tistory.com/55폼 상태 변경 시 불필요한 리렌더링이 발생하지 않게 하기 위해
react-hook-form 활용
추가로 validation 및 error처리에 용이한 패턴 구축
타입스크립트 사용으로인해 프로젝트 타입 안정성 강화 및 유효성 검증을 위한 zod 활용
https://deswaq.tistory.com/61
프로젝트 설명
구하기 어렵거나 비싼 아이템들을 대여비를 받고 빌려주고 빌리는 행위를 통해,
많은 사람들이 다양한 스타일을 즐길 수 있는 옷 대여 서비스
사용 기술
React, TypeScript, Tanstack-Query, Zustand, MSW, Yarn, TailwindCSS
쇼핑몰 소셜로그인 기능 구현
채팅 서비스 사진 업로드 리사이징 기능구현
실시간 1:N 채팅 서비스 구현
Eslint 규칙 설정 및 통일화
msw기반 모킹 데이터 활용 환경 구축
react-hook-form 기반 폼 최적화
- 프로젝트명
- Red-Ribbon
- 소속/기관명
- 오즈코딩스쿨
- 프로젝트 기간
- 2024.04. - 2024.05.
- (2개월)
- 프로젝트 설명
oauth2를 이용한 소셜(카카오) 로그인
폼 상태 변경 시 불필요한 리렌더링이 발생하지 않게 하기 위해 react-hook-form 과 유사한 formik 활용
타입스크립트 사용으로인해 프로젝트 타입 안정성 강화 및 유효성 검증을 위한 Yup 활용
vercel 을 이용한 프론트엔드 CI/CD 배포
프로젝트 설명
자신만의 한달 예산과 고정지출을 정하고 나의 소비습관을 확인할 수 있는 가계부 서비스
사용기술
React, TypeScript, Tanstack-Query, MSW, Yarn, Vanilla-ExtractCSS
소셜로그인 기능 구현
예산,고정지출,지출 CRUD
배포
포트폴리오
교육
- 소속/기관
- 오즈코딩스쿨
- 종류 | 전공명/전공계열
- 사설 교육 | 프론트엔드
- 재학 기간 (재학 상태)
- 2023.12. - 2024.06. (졸업)