Skip to content
 
 

Repository files navigation

신인 작가 및 미대생 미술품 커머스 플랫폼 '유무'

1. 프로젝트 개요

  • 소속: 코드잇 프론트엔드 엔지니어 부트캠프 2기, 파트 4 - 7팀
  • 개발 기간: 2024. 02. 20 - 2024. 04. 04 (6주 소요)
  • 개발 인원: 프론트엔드 개발자 5명, 백엔드 개발자 2명, 디자이너 1명
  • 배포 링크: https://yu-mu.vercel.app
  • 주요 기능
    • 작품 등록 및 관리:

      • 작품 제목, 설명, 이미지 업로드, 카테고리(회화, 조각, 사진 등) 선택 기능 제공.
      • 작품 가격 설정 및 경매 시작 시간, 종료 시간 설정.
    • 경매 참여: 라이브 방송으로 경매 참여, 실시간 입찰 현황 확인

    • 작품 감상 및 검색:

      • 다양한 작품을 검색하고 감상할 수 있도록 필터링 및 검색 기능 제공
      • 작품에 대한 상세 정보 및 작가의 이력, 작품 배경 등을 설명하는 섹션 제공.
    • 경매 알림 및 푸시 알림:

      • 자신이 입찰한 작품에 대한 경매 종료 알림, 새로운 입찰 알림
      • 푸시 알림(미구현)
    • 결제 및 배송 관리: 미구현

    • 작가 인증 및 평가 시스템: 미구현

    • 소셜 공유 및 홍보: 미구현

2. 팀원

프론트엔드

백엔드

디자인

3. 기술 스택

🖥️ 프론트엔드

언어

  • HTML5
  • CSS3
  • JavaScript
  • TypeScript

라이브러리 & 프레임워크

  • React
  • Next.js

상태 관리 & 데이터 처리

  • React Query
  • Axios

스타일링

  • Tailwind CSS
  • shadcn/ui

폼 처리

  • React Hook Form

인증

  • OAuth 2.0
  • KakaoTalk

환경 변수 관리

  • dotenv

⚙️ 백엔드

언어

  • Java 17

프레임워크 & 라이브러리

  • Spring Boot
  • Spring Security

실시간 기능

  • WebSocket

데이터베이스 & 캐싱

  • Redis
  • MySQL

클라우드 & 배포

  • Amazon EC2
  • Amazon S3
  • Amazon RDS

CI/CD

  • GitHub Actions

🎨 디자인

  • Figma

4. 역할

주요 역할

🚀 백엔드 개발자와 협업하여 단일 엔드포인트 API 설계를 통한 네트워크 요청 최적화

  • 경매 목록 조회를 위한 API가 검색, 페이지, 인기순, 최신순 각각의 엔드포인트로 설계 되어, 백엔드와 소통하여 단일 엔드포인트에서 쿼리 파라미터로 검색 키워드, 페이지네이션, 정렬을 처리하는 API 설계를 제안하여 네트워크 요청 4번에서 1번으로 감소, 상태 관리의 복잡성을 낮추어 코드 유지 보수성 향상

🚀 디자인 변경에 따른 반복 수정 해결을 위한 글로벌 Layout 설계

  • 디자인 시안이 완성되지 않은 상태에서 개발이 동시에 진행되면서, 디자인 변경 시 각각의 페이지에서 반복 수정이 발생하여 이를 해결하기 위해 글로벌 Layout 설계 및 적용하여 페이지 구조를 모듈화하여 유지 보수성을 높임.

담당 역할

🖥 UI 개발

  • 공통 컴포넌트: SearchForm, Pagination, SortSelector, PoplualrAucitonList(shadcn/ui의 캐로셀 컴포넌트를 커스터마이징하여 인터랙션 구현), LikeButton,LiveTimer
  • 페이지: 검색 페이지, 상품 상세 페이지, 404 페이지

⚙ 기능 개발

  • 경매 라이브 타이머 기능, 날짜 포맷팅 함수 구현

🛠 기타 작업

  • 글로벌 Layout 설계

5. 역할 분담

성은지

  • 회원가입 및 로그인 페이지 구현
  • 소셜 로그인 기능 개발
  • 인증 시스템 구축

정현진

  • 메인 페이지 개발
  • 경매 알림 기능 구현

김윤미

  • 검색 페이지 및 작품 상세 페이지 개발
  • 글로벌 Layout 설정
  • 경매 라이브 타이머 기능 구현

이서영

  • 경매 등록 페이지 및 경매 입찰 페이지 개발
  • 라이브 채팅 기능 구현

박지원

  • 마이 페이지 개발
  • 타입 정의 및 API 설정

6. 미리보기

메인 페이지

이미지

검색 페이지

이미지

상세 페이지

이미지

작품 등록 페이지

이미지

입찰 참여 페이지

이미지

About

코드잇 스프린트 프론트엔드 엔지니어 트랙 2기 파트4 7팀 프로젝트

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages