Skip to content

frame-it-front 프론트엔드 레포지토리 입니다.

Notifications You must be signed in to change notification settings

Frame-It/frame-it-front

Repository files navigation

Frameit:프레이밋

| 🔗 배포 링크

프레이밋이란?

프레이밋은 사진을 찍는 사람(작가)와 본인의 사진을 남기고 싶은 사람(모델)을 연결시켜주는 플랫폼입니다.

프레이밋에서는 프로젝트를 개설하고 신청할 수 있으며, 개인 포트폴리오를 업로드하여 다른 유저와 연결될 수 있습니다.

기간

2024.05 ~ 진행 중

구성원

기능

1. 회원가입 / 로그인

회원가입, 로그인 화면 회원가입 약관 화면 역할 선택 화면
이름, 생년월일 입력 화면 닉네임 입력 화면 회원가입 완료 화면

  • 카카오와 구글 아이디를 통해 로그인할 수 있습니다. 비회원의 경우 프로젝트 공고 목록과 피드 목록을 볼 수 있습니다.
  • 사용자는 작가와 모델 중 하나의 역할을 선택하여 회원가입 할 수 있습니다.
  • 프레이밋에서는 닉네임으로 활동합니다.

2. 모집

프레이밋의 핵심 기능으로, 프로젝트 호스트와 작가 혹은 모델을 연결하는 서비스입니다.

호스트가 게시한 프로젝트 공고에 맞는 사용자들이 프로젝트에 신청하여, 적합한 파트너를 쉽게 찾을 수 있습니다.

모집 공고

모집 목록 공고 상세 화면 프로젝트 신청 모달

  • 프로젝트 공고: 사용자들은 자신과 맞는 프로젝트를 선택하고 신청할 수 있습니다.
  • 북마크 기능: 관심 있는 프로젝트 공고는 북마크하여 관리가 용이합니다.

프로젝트 관리

프로젝트 관리 게스트 화면 프로젝트 관리 호스트 화면

  • 프로젝트 관리: 참여중인 프로젝트의 진행 상태를 추적할 수 있습니다.
  • 리뷰 기능: 프로젝트 완료 후 파트너에 대한 리뷰를 작성하여 피드백을 남길 수 있습니다.

3. 피드

작가와 모델이 자신의 작업물을 포트폴리오로 업로드하고 공유할 수 있는 공간입니다.

피드 화면 포트폴리오 상세 화면 포트폴리오 등록 화면 1
포트폴리오 등록 화면 2
  • 피드: 다른 사용자들의 포트폴리오를 피드 형태로 볼 수 있습니다.
  • 마이 스튜디오: 사진 작업물이 담긴 포트폴리오를 등록할 수 있습니다.

4. DM

5. 마이페이지

사용자 활동 내역을 기록하고 표현하는 개인 페이지입니다.

프로젝트 관리, 포트폴리오 등록, 프로필 수정 등 다양한 활동을 할 수 있습니다.

마이 스튜디오 화면 프로필 편집 화면 계정 정보 화면

기술 스택

📌 Frontend

분류 기술 스택
프레임워크 & 언어 Next.js TypeScript
상태 관리 Zustand
데이터 요청 TanStack Query
폼 & 유효성 검사 React Hook Form Zod
스타일링 Tailwind CSS
알림 Firebase
코드 포맷팅 ESLint Prettier

프로젝트 실행

npm run dev # development
npm run build && npm run start # production

About

frame-it-front 프론트엔드 레포지토리 입니다.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages