미리보기
기본 정보
같은 서비스라도 UI/UX 디자인의 변화로 사용자에게 전혀 다른 경험을 선사할 수 있다는 점에 매력을 느껴 프론트엔드 개발을 시작하게 되었습니다. 간단한 웹 사이트 하나 구현하는 것도 어려웠던 저는, 6개월간의 부트캠프를 통해 다양한 기술 스택을 익히고 직접 프로젝트를 기획하고 구현할 수 있는 능력을 갖추게 되었습니다. 이를 통해 저의 성장 가능성을 확인할 수 있었고, 해낼 수 있다는 자신감을 얻었습니다. 그리고 이제는 이를 바탕으로 더 큰 도전에도 자신 있게 나설 준비가 되었습니다.
기술 스택
HTML/CSS, JavaScript, TypeScript, React, tailwind-css
프로젝트
냉장고 뚝딱이 (프론트 3, 백엔드 4)
oz 코딩 스쿨
2024.05. ~ 2024.06.
Description
다양한 자취 레시피를 공유하고 , 냉장고 속의 재료로 만들 수 있는 레시피를 찾아주는 서비스입니다. (github)
Experience
사용자 접근성 향상을 고려한 레시피 공유 기능 구현
비로그인 사용자도 공유된 레시피에 접근할 수 있도록 구현하여 진입 장벽을 낮추고 사용자 경험을 향상
공유된 페이지 내에서 상호작용을 시도 할 때 로그인되어있지 않으면 로그인 페이지로 리다이렉트
4단계의 레시피 작성 프로세스 구현
각 단계의 필수 요소가 입력되었는지 유효성 검사를 진행하고 작성 중에 페이지를 이탈하여도 데이터가 유지될 수 있도록 zustand persist를 사용
로딩 UX 개선을 위해 Skeleton UI를 적용
Figma를 사용하여 전체 UI/UX 디자인 설계
데일리 스크럼을 진행하여 프로젝트 진행 상황을 공유
Tech Stack
React , Typescript, zustand, react-query, tailwind-css, axios , figma
okivery (프론트 2, 백엔드 2, 사업 개발 2)
oz 코딩 스쿨
2024.04. ~ 2024.05.
Description
한국에 거주하는 외국인들을 대상으로 한 배달 음식 서비스입니다. (github)
Experience
UI/UX를 고려한 개발
filter를 사용해 레스토랑 메뉴의 카테고리 데이터를 추출하고, UX 향상을 위해 운영 중이 아닌 가게는 카테고리 리스트에서 후 순위로 배치.
주문서 페이지에서 품절이거나 영업 중이 아닌 상태를 UI로 표시해 결제 버튼을 비활성화하고, 결제 페이지에서는 결제 실패 시 품절 또는 영업 종료 사유를 포함한 오류 메시지를 출력.
api request 최적화
불필요한 API 호출을 피하기 위해 메뉴를 장바구니에 담을 때 localstorage에 저장하고, 장바구니 페이지 접속 시 해당 데이터를 서버에 전송함.
소통을 통한 프로젝트 방향 개선
단일 배송에 맞춰진 기존 디자인을 개선하기 위해 묶음 배송 서비스에 적합한 새로운 디자인을 제안하여 프로젝트의 품질을 향상
Tech Stack
React , Typescript, zustand, axios
포트폴리오
자격증
정보처리기사
한국산업인력공단
2023.06.
교육
강원대학교
대학교(학사) | 컴퓨터정보통신공학과
2019.03. ~ 2023.08. | 졸업
OZ 코딩스쿨
사설 교육 | 프론트엔드 개발자 과정
2023.12. ~ 2024.06.