SEB_41_MAIN_PROJECT

부트캠프를 통해 배웠던 기술 스택과 Pre-Project에서 경험한 내용을 토대로 실제 서비스를 기획 단계부터 배포까지 개발합니다.

과외차이

매칭으로 끝내지 않는 비대면 통합 과외 관리 서비스, 과외차이

• 비대면 특화 과외 매칭 및 관리 서비스
• 서비스 내에서 매칭된 과외는 과외 현황을 확인할 수 있는 관리 기능 제공

프로젝트 기간

2023.01.03 ~ 2023.03.02

배포 링크

👩‍🏫과외차이

• 테스트 계정
  • 튜터
    • ID: tutor@tutor.com
    • PW: 1111111t
    • 2nd PW: 1234
  • 튜티
    • ID: tutuee@tutee.com
    • PW: 1111111t
    • 2nd PW: 1234

📝API REST Docs

기술 스택

FrontEnd

Backend

Server Infra

Team Tools

프로젝트 소개

회원 인증

-.Chrome.2023-01-30.17-16-50.mp4

서비스 자체 회원은 물론 OAuth를 이용한 구글/카카오 계정을 통해 회원가입 및 로그인을 할 수 있습니다.

매칭 서비스

-.Chrome.2023-01-30.17-18-34.mp4

원하는 상대에 대한 정보를 입력해 등록하고 다른 사람들이 등록한 프로필을 확인할 수 있습니다. 필터나 검색을 이용해 원하는 상대를 찾을 수 있습니다.

여러 과외나 학생을 관리하기 위한 다중 프로필 기능을 지원하며, 서비스 내에서 매칭을 할 수 있도록 메세지 기능을 제공합니다.

• 2023.02.20. 실시간 채팅 기능 추가
  기존 메세지 기능을 WebSocket 기술을 활용해 실시간 채팅으로 업데이트 하였습니다.

과외 관리 서비스

-.Chrome.2023-01-30.17-19-36.mp4

서비스 내에서 매칭이 성사되면 자동으로 과외 관리 페이지를 생성합니다. 과외 관리 페이지에서는 튜터가 작성한 과외 일지를 통해 현재 진행 중인 과외의 현황을 확인 할 수 있습니다.

반응형 웹 및 PWA 적용

default.mp4

반응형 웹을 적용해 다양한 디바이스에서 서비스를 이용 할 수 있습니다.

또한, PWA(Progressive Web App)을 적용해 웹 어플리케이션으로도 사용할 수 있습니다.

알림 기능

default.mp4

서비스를 이용하면서 확인이 필요한 부분에 알림 기능을 제공합니다.

• 적용 대상 : 메세지 / 매칭 요청 / 매칭 승인 / 새로운 일지 / 과외 종료 요청 / 과외 종료

프로젝트 목표

프론트엔드와 백엔드 간 협업을 통하여 실무에 준한 협업과 개발 역량 향상

• 회원 가입, JWT 토큰 기반 인증 로그인
• OAuth 2.0 기반 소셜 (구글/카카오) 가입 및 로그인
• 회원 정보 수정 및 탈퇴
• 매칭을 위한 프로필 추가, 조회, 수정, 삭제
• 매칭을 위한 다른 프로필 조회 및 검색, 필터
• 사용자 간 Message 송/수신
• 과외 관리를 위한 과외 추가, 조회, 수정, 삭제
• 과외 현황 관리를 위한 일지 추가, 조회, 수정, 삭제

프론트엔드

• React, Router를 활용한 SPA 어플리케이션 개발
• 전역 상태의 효율적 관리를 위한 Recoil 사용
• Components Driven Development
• 통일성 있는 UI/UX를 위한 디자인 시스템 적용
• CSS 작성의 통일 및 모듈화를 위한 PostCSS 사용
• S3 Bucket 정적 페이지 배포
• ACM, CloudFront를 통한 HTTPS 연결 지원

백엔드

• Java & Spring 기반 REST API 백엔드 서버 어플리캐이션 구현
• 새로운 기술과 라이브러리를 학습하고 적용
• 요구 사항 정의서에 기술된 목표 기능 구현
• QueryDSL 라이브러리를 사용한 쿼리 성능 최적화
• JUnit5, Mockito를 이용한 단위 테스트 코드를 작성하여 구현 코드에 대한 신뢰성 확보
• Controller 단위 테스트 기반 REST API SPEC Docs 작성
• GitHub Actions CI/CD 구축
• AWS EC2, S3, CodeDeploy, RDS, ElastiCache를 이용한 서버 인프라 구축
• Nginx 활용한 서버 Reverse Proxy, Load Balancing 적용

프로젝트 문서

프로젝트 관리 Notion
프로젝트 관리 Sheet (사용자 요구사항 정의서, 테이블 명세서, ERD)
화면 정의서
Prototype
User Flow

프로젝트 팀 소개: 3조 쓰앵님👨‍🏫

김민경 FE / Team Leader	이수영 BE / Part Leader	신승구 FE	강호수 BE	유영민 FE	김다은 BE
@ansmeer008 🐌	@sussa3007 🐌	@ninefloor 🐌	@hosoo3513 🐌	@ymymmz9 🐌	@DaeunKim9 🐌

팀 규칙

1. 매일 오전 9시 간단한 인사와 이슈 공유를 위한 스탠딩 회의
   • 지각은 금물, 전화 받아도 화내지 않기
2. 상시 상주 시간 : 오후 1시 ~ 오후 6시
3. 조퇴/불참은 사전에 팀 단위 공유
4. 모르는 부분은 물어보고, 설명 잘 하기
5. 회의 때는 캠 필수!
6. 상주/저녁 시간은 모각코 시간

GitHub Rules

• ISSUE
  1. 개발 계획, 버그, 문제 등을 빠르게 적용하여 템플릿 양식에 맞춰 작성.
  2. 작성자 정보를 기입.
  3. 백엔드/ 프론트 와 feat/bug 등 필요한 라벨을 추가하여 작성.
  4. Assignees에 담당 팀원을 설정.
  5. 적절한 Projects와 마일스톤을 설정.
• COMMIT
  1. 하나의 수정사항 당 하나의 커밋을 생성하기.
  2. 가능한 세부적으로 커밋 하기.
  3. 이미 지나 버렸다면, 그냥 커밋하기.
  4. 가능하면 Title에 커밋 내용 작성하기
  5. 커밋 컨벤션

     feat : 새로운 기능 구현
     fix : 버그 수정
     refactor : 리팩토링
     docs : 문서 수정
     design : css 등 UI 디자인/ 포멧팅, 세미콜론등 로직의 직접적인 변동 없는 수정
     rename : 파일 또는 디렉토리 명 수정
     remove : 단순 파일 삭제
     test : 테스트 코드 작성 및 수정
     chore : 기타 변경 사항
     

• PULL REQUEST
  1. 하나의 기능 구현 단위로 PR 하기
  2. PR의 Projects는 설정 하지 않기
  3. 필요한 라벨추가 하기
  4. 커밋 네이밍과 같은 규칙으로 작성하기
  5. PR 시 2명 이상의 리뷰 후 Merge하기
• BRANCH
  • Coz' Git Flow - main, dev, feat, test, refactor
  • 현재 과업을 간략히 나타낼 수 있을 만큼만 네이밍.
  • ex - fe/feat_todo , be/feat_todo