Skip to content

Nahaeran/twogather

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

1,062 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

공간 대여 플랫폼 TWOGATHER

image

서비스 링크

http://34.64.86.202/

서비스 시연 영상

https://www.youtube.com/watch?v=al_ei550YEs


1. 서비스 소개

  • 목표
    Host와 Guest의 계정 구분 없이 공간 대여와 제공을 동시에 할 수 있는 프로슈머(Prosumer) 서비스를 제공한다.

    • 회원가입, 로그인, 호스트 등록 기능을 제공한다.
    • 마이 페이지에서 나의 정보와 예약내역, Q&A, 리뷰를 조회/등록/수정이 가능하다.
    • Host가 계정을 생성한 뒤 공간(Space)를 등록한다.
    • 등록한 공간(Space)에 대한 상세 룸(Room)을 등록한다.
    • 여러가지 검색 옵션을 이용해 룸(Room)을 필터링하여 조회할 수 있다.
    • Guest는 검색한 룸(Room)을 시간당 금액과 이용 가능한 시간대를 확인한 후 예약할 수 있다.
    • Host 또한 Guest로서 이용하고자 하는 룸(Room)을 예약할 수 있다.
    • 리뷰, Q&A를 이용해 Host와 Guest가 소통한다.
    • 전체 유저 조회 등 관리자 기능을 제공한다.
    • 관리자(홈페이지) Host와 Guest에게 홈페이지 이용에 대한 공지사항을 할 수 있다.
  • 기획의도

    • Prosumer가 되고 싶어하지 않을까?
      다양한 형태의 공간 쉐어링이 보편화된 요즘, 공간 호스팅이 가능한 서비스들은 많다. 기존 서비스들은 호스트로서 공간을 등록하기도 하지만, 그 호스트가 Guest가 되어 쓰고 싶은 방을 예약하려면 게스트와 호스트 계정을 따로 생성해야 하고, 불필요하게 계정이 많아지면 관리해야 할 데이터의 양도 늘어난다. 이와 같은 형태의 비즈니스의 사용자 경험과 리소스 관리 측면을 고려하여 게스트와 동시에 호스트가 될 수 있는 TWOGATHER를 기획하였다.

2. 웹 서비스의 주제 및 기능 설명

  • 주제: 공간 대여 플랫폼

  • 기능

    1️⃣ 회원가입, 로그인, 로그아웃

    • 카카오 소셜 회원가입 및 로그인
    • 로그인 시 유저 권한에 따라 페이지 접근
    • 비밀번호 분실 시, 가입한 이메일로 임시 비밀번호 발송

    2️⃣ 마이페이지

    • 내 정보 수정 및 프로필 사진 등록
    • 내 예약 내역
    • 내가 작성한 리뷰 및 Q&A 목록

    3️⃣ 공간 조회

    • 지역, 공간유형, 공간명, 해시태그 등 키워드로 공간 검색
    • 등록순, 가격순 등 공간 조회 필터링

    4️⃣ 공간 예약

    • 공간 이미지 슬라이드
    • 공간 설명 및 지도
    • 날짜별 예약 불가능한 시간대 필터링
    • 시간대별 룸 예약

    5️⃣ 공간 호스팅

    • 호스트 등록
    • 공간/룸 등록 및 수정, 삭제
    • 내 공간 예약 내역 관리
    • 내 공간 리뷰 및 Q&A 관리

    6️⃣ 관리자

    • 유저 관리
    • 전체 예약 내역 관리
    • 공지사항

3. 프로젝트만의 차별점, 기대 효과

  • 기존 서비스의 단점 -> 본 프로젝트의 장점
    기존 서비스는 공간 호스팅을 하려면 호스트 계정을 따로 생성해야하는 번거로움이 있었음.
    → 본 프로젝트는 호스트 계정을 따로 생성할 필요 없이 일반 유저도 호스트 등록만 하면 공간 호스팅이 가능
    → 호스팅 접근성 상승

  • 본 웹서비스의 사용자가 경험할 효과 및 장점
    다양한 필터와 검색을 통해 편리하게 공간 검색 가능
    복잡한 로그인 없이 계정 하나로 공간 호스팅과 공간 대여 예약 가능

4. 제작 기간, 구성원 역할

  • 제작 기간: 22.07.04 ~ 22.07.24
이름 역할 구현 기능
강예정 프론트엔드 공간,룸 CRUD, 유저목록
김미지 프론트엔드 공간 상세, 공간 예약, 호스트/어드민 예약관리, 호스트 Q&A 관리, 해시태그
나해란 프론트엔드 홈, 공간 목록, 공지사항 CRUD, 공간 해시태그 검색
남연진 프론트엔드 로그인, 로그아웃, 회원가입, 마이페이지, 리뷰, Q&A
김태훈 백엔드 EC2 MySQL 서버 생성 및 관리, 관계형 DB 모델링 및 ERD 작성, REST API 개발 및 Swagger 문서 작성, 인증/인가 구현, Slack Git 연동 등
장종원 백엔드 EC2 Jenkins(CI&CD), DB 구축 및 REST API 개발, API Document(Swagger), AWS S3(lambda)

5. 기술 스택

  • 프론트엔드
    • React
    • JavaScript
    • Styled-components
    • Axios
  • 백엔드
    • TypeScript
    • 프레임 워크: Nest
    • DB: MySQL, typeORM
    • DevOps: Jenkins, AWS EC2, S3(lambda)
    • 기타 협업 도구 : Swagger, Postman, Slack

6. 프로젝트 구조도

  • 로그인

  • 예약 등록

  • Figma figma

7. 페이지별 화면

메인 공간 조회
메인 공간 조회
공간 상세 예약
공간 상세 예약
회원가입 로그인
회원가입 로그인
마이 페이지
마이페이지
리뷰 등록 Q&A 등록
리뷰 QNA
호스트로 등록 호스트 공간 관리
호스트 등록 공간 등록
호스트 공간 등록 호스트 룸 등록
공간 등록 룸 등록
예약 관리 예약 내역 상세
예약관리2 예약 내역 상세
Q&A 관리
answer 등록
공지사항 유저 관리
공지사항 유저 관리
전체 예약 관리
전체 예약 관리

About

React.js, Nest.js, JavaScript, TypeScript, MySQL, AWS EC2, S3, Jenkins 등을 이용한 공간 예약 시스템입니다.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages

  • JavaScript 52.3%
  • TypeScript 46.3%
  • Other 1.4%