3팀-Moving-FE

📅 2025.01.06 ~ 2025.02.25

📣 Overview

📖 소개 (Introduction)

Moving은 사용자들이 다양한 이사 서비스를 편리하게 요청하고, 이사 업체로부터 견적을 받을 수 있도록 돕는 온라인 플랫폼입니다.

사용자는 자신의 이사 유형(소형 이사, 가정 이사, 기업·사무실 이사 등)에 맞는 서비스를 선택한 후, 간편하게 견적 요청을할 수 있습니다.
원하는 이사 업체를 검색하고 원하는 업체에 직접 견적 요청을 할 수 있는 기능을 제공합니다.
개인정보를 노출시키지 않고 원하는 업체와 실시간 채팅으로 이사 정보에 대해서 소통할 수 있습니다.
각 업체의 리뷰를 모두 볼 수 있으며, 요약된 리뷰, 리뷰 키워드 분석 등 많은 정보를 토대로 업체를 선정할 수 있습니다.
업체도 고객님들의 이사 정보에 대해서 카카오 맵을 통해 웹사이트 내에서 바로 위치를 파악할 수 있습니다.

🚚 배경 (Background)

이사 서비스 시장은 기존에 오프라인 중심으로 운영되었으며, 고객들은 여러 업체에 일일이 연락하여 견적을 비교하는 불편함을 겪었습니다. Moving은 이러한 문제를 해결하기 위해 온라인에서 손쉽게 이사 견적을 비교하고, 신뢰할 수 있는 이사 업체를 찾을 수 있도록 지원하는 플랫폼으로 등장하였습니다.

디지털화된 이사 견적 시스템을 통해 고객들은 보다 효율적인 비용 비교와 업체 선택이 가능하며, 이사 업체들도 온라인을 통해 더 많은 고객을 만날 수 있는 기회를 얻게 됩니다.

이제 사용자는 Moving을 통해 보다 간편하고 투명한 이사 경험을 할 수 있습니다.

🔗 관련 링크

🌐 Moving 홈페이지 바로가기
📄 API 명세서 바로가기
📂 Back-End Repository
📘 Moving team 협업 문서

👨‍👨‍👧 팀원 구성

박효빈
Frontend

김재원
Frontend

이도엽
Frontend

📚 기술 스택

FrontEnd

Infrastructure

Tools

Etc

🙋‍♂️ R&R

김재원

프론트엔드 회의 정리
총괄

이도엽

노션 프론트엔드 페이지 정리
프론트엔드 일정 관리
프론트엔드 깃허브 README.md

박효빈

PPT 제작
발표
피그마 제작 및 수정
초기 세팅 & 배포 자동화

🖥 팀원별 구현 기능 상세

김재원

랜딩 페이지

비회원
일반 유저
기사님

기사님 상세 페이지

비회원
일반 유저
기사님

내 견적 관리 페이지

대기 중인 견적 상세 페이지 (일반유저)
받았던 견적 상세 페이지 (일반 유저)
확정 견적 상세 페이지 (드라이버)

마이 페이지

기사님

페이지 외 고도화

ReactQuery hook
Storybook 작성
Jest 유닛 테스트 코드 작성
web share api 공유하기 기능 추가
랜딩 페이지 권한 설정(비회원, 일반유저, 기사님) 및 이사 정보 생성 UX
라이트/다크 모드 기능
Framer-Motion + React-Spring 기능
Skeleton UI 기능

이도엽

프로필 등록 & 수정 페이지

일반 유저
기사님

기본 정보 수정 페이지

기사님

견적 요청 & 수정 페이지

일반 유저

리뷰 페이지

작성 가능한 리뷰 페이지 (일반유저)
내가 작성한 리뷰 페이지 (일반유저)

실시간 채팅 페이지

일반 유저
기사님

페이지 외 고도화

Storybook 작성
Jest 유닛 테스트 코드 작성
프로필 수정 페이지 비밀번호 확인 ui & 기능 구현 (일반유저 || 소셜로그인 유저)
프로필 등록 페이지 경력 시작 calendar ui & 기능 구현
견적 요청 페이지 시간 선택 ui & 기능 구현
유저 & 소셜로그인 유저에 대한 계정 검증 ui 및 기능 구현
견적 요청 페이지 랜딩 페이지 이사 유형 연결
채팅 페이지 실시간 웹소켓 통신 & 온라인 유무 & 작성중 유무 & 사진 삽입 ui & 무한스크롤 기능 구현
social login verify page

박효빈

로그인 & 회원가입 페이지

일반 유저
기사님

기사님 찾기 페이지

비회원
일반 유저

받은 요청 페이지

기사님

내 견적 관리 페이지

대기중인 견적 페이지 (일반 유저)
견적 요청 수정 및 취소 페이지 (일반 유저)
받았던 견적 페이지 (일반 유저)
확정 견적 페이지 (드라이버)
내 견적 관리 - 반려 견적 요청 페이지 (드라이버)

찜한 기사님 페이지

일반 유저

소셜로그인 콜백 페이지

naver
google
kakao

NotFound 페이지

공통

Headless 컴포넌트 제작
Nav ui
Empty ui

페이지 외 고도화

Storybook 작성
Jest 유닛 테스트 코드 작성
카카오맵 API & ui
PWA 기능 제작
음성인식 기능 제작
Skeleton UI 기능
리뷰 요약 API 연결 및 ui 추가
키워드 분석 API 연결 및 ui 추가
access token middleware 작성
알림 & 프로필 모달 ui
useGeolocation hook
실시간 알림 웹소켓 통신

🔑 프로젝트 환경 변수 설정

프로젝트의 루트 디렉토리에 .env 파일을 생성합니다.
이 파일에 아래와 같은 환경 변수 항목을 추가해주세요.
(실제 값은 여러분의 환경에 맞게 입력해야 합니다.)

NEXT_PUBLIC_BASE_URL=<your-backend-api-url>
NEXT_PUBLIC_KAKAO_API_KEY=<your-kakao-api-key>
NEXT_PUBLIC_KAKAO_MAP_KEY=<your-kakao-map-api-key>
NEXT_PUBLIC_KAKAO_REST_KEY=<your-kakao-rest-api-key>

Name		Name	Last commit message	Last commit date
.github		.github
.storybook		.storybook
cypress		cypress
public		public
src		src
tests		tests
.gitignore		.gitignore
.prettierrc.mjs		.prettierrc.mjs
README.md		README.md
cypress.config.ts		cypress.config.ts
eslint.config.mjs		eslint.config.mjs
global.d.ts		global.d.ts
jest.config.ts		jest.config.ts
jest.setup.ts		jest.setup.ts
next.config.mjs		next.config.mjs
package-lock.json		package-lock.json
package.json		package.json
postcss.config.mjs		postcss.config.mjs
tailwind.config.ts		tailwind.config.ts
tsconfig.json		tsconfig.json

Navigation Menu

Uh oh!

Repository files navigation

3팀-Moving-FE

📣 Overview

📖 소개 (Introduction)

🚚 배경 (Background)

🔗 관련 링크

🔎 목차

👨‍👨‍👧 팀원 구성

📚 기술 스택

🙋‍♂️ R&R

🖥 팀원별 구현 기능 상세

김재원

이도엽

박효빈

🔑 프로젝트 환경 변수 설정

About

Releases

Packages

Used by

Contributors

Languages

Uh oh!

Latest commit

History

Folders and files

Repository files navigation

3팀-Moving-FE

📣 Overview

📖 소개 (Introduction)

🚚 배경 (Background)

🔗 관련 링크

🔎 목차

👨‍👨‍👧 팀원 구성

📚 기술 스택

🙋‍♂️ R&R

🖥 팀원별 구현 기능 상세

김재원

이도엽

박효빈

🔑 프로젝트 환경 변수 설정

About

Resources

Stars

Watchers

Forks

Releases

Packages

Used by

Contributors

Languages