미리보기

e-commerce 개발

전통시장에서 판매하는 상품을 온라인에서 주문, 결제, 배송이 가능한 플랫폼 사이트 개발

• 주문 상품 교환 / 환불 / 취소 프로세스 구현 경험

• Server Driven UI 설계를 통해 UI 유연성 향상

• 디자인 시스템 구축으로 UI 일관성 및 컴포넌트 재사용성 향상

• 페이지 메타태그 추가, 서버 사이드 렌더링 적용으로 SEO 최적화

[채팅 시스템]

유저가 창작한 게임 내에서 유저 간 소통을 지원하는 텍스트 채팅 및 음성 채팅 기능 개발

• 텍스트 및 음성 채팅 기능 개발

  • Promise와 에러 핸들링 로직을 설계해 채팅 메시지가 상태 변화에 따라 순차적으로 처리되도록 구현

• React.memo, useMemo, useCallback 활용을 통해 불필요한 리렌더링을 방지하여 성능 최적화 및 사용자 경험 개선

[웹 플랫폼 개발]

다양한 기기와 국가에서 유저가 만든 게임을 원활히 즐길 수 있는 웹 플랫폼 구축

• 클라이언트와 서버 상태 분리를 통해 전역 상태 관리 방식 개선

  • 기존 Redux로 모든 상태를 관리하던 구조에서 Redux Toolkit과 React Query를 도입해 클라이언트와 서버 상태의 관심사 분리

  • Boilerplate 코드 감소 및 상태 관리의 가독성 및 유지보수성 향상

• 성능 최적화 작업을 통한 사용자 경험 개선

  • Lazy Loading을 통해 페이지 로딩 시간 단축

  • 검색 시 API 호출 최적화를 위해 디바운싱 기법을 적용해 불필요한 API 호출을 줄여 응답 속도 개선

• react-intl 활용한 다국어 지원을 통한 글로벌 사용자의 접근성 향상

[라이브 강의 서비스 개발]

온라인 코딩 교육 실시간 화상 수업 서비스 구축 및 유지보수

• 유저 플로우 분석을 통한 UI/UX 개선

  • GA를 통한 유저 플로우 분석 결과를 바탕으로 무료체험 신청 프로세스의 UI/UX를 개선하여 이탈률 20% 감소

• 다양한 기기에 최적화된 반응형 웹 페이지 구현을 통한 사용자 경험 개선

자체 및 외부 서비스 초기 기획부터 운영 경험 보유

디자인 시스템 및 모노레포 구현을 통한 개발 효율성 및 유지보수성 향상

• 디자인 시스템 구축을 통해 일관성 있는 사용자 경험을 제공

• 모노레포를 도입해 패키지별 의존성을 최소화하여 개발 생산성과 유지보수성 향상

• 단위 테스트 구현을 통한 디자인 시스템의 안정성 확보

• Vitest를 통해 디자인 시스템 컴포넌트의 동작을 검증하여 예기치 않은 UI 오류를 방지하고 구현 안정성 강화

29cm 쇼핑몰 사이트의 UI를 참고하며 한 사이클(로그인, 장바구니, 결제)을 구현해보는 사이드 프로젝트

• 로딩 및 접근성 개선을 통한 사용성 향상

  • useSuspense와 Skeleton UI를 활용해 로딩 상태에서의 사용성 개선

  • ARIA 속성 및 이미지 alt 태그를 통해 접근성을 강화하여 모든 사용자에게 원활한 경험 제공

• E2E 테스트를 통해 시스템 안정성 향상

  • E2E 테스트 도입으로 로그인 플로우를 포함한 실제 사용자 경험을 검증하고 시스템 안정성 강화

• MSW 도입을 통한 FE 개발 효율성 향상

  • MSW 도입으로 프론트엔드 개발 시 실제 API를 기다리지 않고 Mock API를 구현해 백엔드 API 개발과의 간격을 줄여 효율적으로 개발 진행

• JWT를 이용한 토큰 기반 인증 시스템을 구축하여 세션 관리 및 인증 프로세스를 안전하게 구현

• react-hook-form 및 zod를 활용한 폼 유효성 검사 자동화 및 사용자 입력 오류 최소화