💛 FINAL 프로젝트 feat.D'art

프로젝트 기간 : 2024.05.22 ~ 현재 진행 중

🔗 D'art 서비스 둘러보기 (데스크탑/태블릿/모바일 환경에서 이용 가능)

🎬 시연 영상 보러가기

✨ 프로젝트 소개

예술의 X. D'art

• "예술의 공유, 전시의 즐거움"
• D'art는 누구나 참여가능한 작품 전시 플랫폼입니다.
• 디자이너가 아니더라도 누구나 자신이 평소에 공유하고 싶어하는 작업물, 취미 기록 등을 전시 형태로 남기실 수 있습니다.
• 전시는 여러 사용자들이 관람 뿐 아니라 채팅을 통해 서로 의사소통 가능합니다.
• 전시 작가는 다양한 템플릿으로 전시를 할 수 있습니다.
• 오프라인 뿐 아니라 온라인에서도 홍보를 하고싶어 할 경우에 유용한 플랫폼입니다.
  

⭐️ 주요 기능

📌 인트로

• 전체적으로 어떤 서비스인지를 간략한 소개와 함께 나타내었습니다.

📌 메인

• 검색 기능과 페이징처리된 전시장을 제공하여 사용자가 원하는 전시를 빠르게 찾을 수 있도록 도와줍니다.

📌 로그인 / 회원가입

• 소셜로그인을 비롯한 이메일 인증을 통한 회원가입 및 로그인을 이용할 수 있으며, 저작권과 관련된 약관 동의 내용을 받습니다.

📌 온라인 전시장

• 5개의 다양한 템플릿을 통해 유저에게 재미를 선사하며, 나만의 전시장을 통해 직접 예술가가 될 수 있는 공간입니다.

📌 전시 생성

• 나만의 전시장을 직접적으로 만들 수 있습니다.

📌 결제 시스템

• 카카오 결제를 이용해서 유료 전시 생성 및 전시 입장료를 지불하여 좀 더 많은 프리미엄 혜택을 누릴 수 있습니다.
• 실제 결제되는 내용이 아닌 데모 결제로 이루어져 있습니다.

📌 실시간 채팅 서비스

• 전시를 감상하며 현재 해당 전시를 관람하고 있는 사람을 확인할 수 있습니다.
• 관람객과 얘기를 나눌 수도, 작가의 안내를 받을 수도 있습니다.

📌 리뷰 및 공유하기

• 즐겁게 본 전시가 있다면 전시에 대한 후기를 작성할 수 있으며, 이를 다른 사람들과 공유하여 즐거운 시간을 보낼 수 있습니다.

📌 마이페이지 / 유저 정보 변경

• 내 정보를 변경하여 다른 사람들에게 좀 더 나를 어필할 수 있으며, 내가 개최한 전시와 결제한 정보를 조회할 수 있습니다.

📌 쿠폰 발급 및 적용

• 이벤트를 통해 발급 받은 쿠폰을 통해서 좀 더 쉽게 서비스에 접근해 볼 수 있습니다.

  📌 반응형 웹 디자인

• 반응형 웹 디자인을 통해 모바일, 태블릿, 데스트톱 어디서든 서비스를 즐길 수 있습니다.

  📌 기타 주요 페이지

• 개발자들의 정보 및 404 페이지 등등...

프로젝트 문서

📒 팀 Notion	🎉 기획안	💌 요구사항	🚀 활동 간 규칙	💬 회의, 회고록	💯 컨벤션

📅 프로젝트 일정

Sprint	기간	내용
1	2024/5/27 - 2024/6/1	베포, 회원 인증 구현, MVP 기능 구현
2	2024/6/3 - 2024/6/8	MVP 기능 구현
3	2024/6/10 - 2024/6/15	API 연동 및 테스트
4	2024/6/17 - 2024/6/22	1차 UI 테스트 및 추가 구현 사항 정리
5	2024/6/24 - 2024/6/29	디벨롭 및 추가 구현 사항 구현
6	2024/7/1 - 2024/7/6	최종 테스트 및 리팩토링

🧑‍🧑‍🧒‍🧒 Front TEAMMATE 소개

강신범	김수현	하승진
FrontEnd	FrontEnd	FrontEnd
FE 팀장, 에러처리, 데이터와 토큰 관리, 배포, 메인 페이지, 공통 컴포넌트와 훅 생성	폼 관리, 실시간 채팅, 결제 시스템, 전시 생성 페이지, 회원정보조회	전시 템플릿, 회원정보 수정, 모달 기능, 저작권 침해 방지 마련, 전시 생성 ux 강화

✔ 아키텍처

💥 기술스택 및 선정이유

📦 파일구조

src
  ᄂ apis (api)
  ᄂ assets (폰트, 이미지[gif, png, jpg])
    ㄴ fonts
    ㄴ images
  ᄂ components (재사용 컴포넌트)
  ㄴ consts (데이터 모음)
  ㄴ mock (mocking서버 api)
  ᄂ hooks (공통 커스텀 훅)
  ᄂ pages (페이지)
    ᄂ callback
    ᄂ chatModal
    ᄂ contact
    ᄂ editMemberInfo
    ᄂ evnet
    ᄂ gallery
    ᄂ info
    ᄂ memberInfo
    ᄂ payment
    ᄂ review
    ᄂ detail
    ᄂ error
    ㄴ login
    ㄴ main
    ㄴ post
    ㄴ signup
  ᄂ routes (라우터)
  ㄴ stores (전역 저장소)
  ᄂ styles (스타일)
  ᄂ types (타입)
  ㄴ utils (계산 커스텀 함수)
    ...
  ᄂ App.tsx