글쓰는쿼카의 PM 여정

[팀프로젝트] 아웃소싱 프로젝트 소개 (2024. 6. 16.) 본문

개발/React

[팀프로젝트] 아웃소싱 프로젝트 소개 (2024. 6. 16.)

글쓰는쿼카 joymet33 2024. 6. 18. 08:41

#스파르타코딩클럽 #내일배움캠프(프론트엔드_React) 
학습주제 : React 심화주차 - 아웃소싱 프로젝트

학습내용 : 팀회의 : 리더 선정, 코드컨벤션, 깃허브룰, 프로젝트 기획(필수 구현 적용), 피그마

학습일 : 2024. 6. 16.


 

1. 프로젝트 설명

 

- 프로젝트 주제 : 아웃소싱 프로젝트(아웃소싱 === 외부 API 활용)

- 프로젝트 기간 : 2024. 6. 17. ~ 6. 21. (총 5일)

- 프로젝트 목표 : (필수 구현 사항)

  • 외부 API 활용 : 지도 API - 한국관광공사 API
  • 전역 상태 관리 라이브러리: Tanstack Query, Zustand 활용
  • DB 활용 : Supabase

<관련 링크>

- 프로젝트 공지 : https://teamsparta.notion.site/React-8d4ac81b2e974d6a8dcbfabb91072c13

- 팀 노션 : https://teamsparta.notion.site/B01-Camparoo-b6d18224a81848918fc887ab035e70d9

- 팀 깃허브 : https://github.com/JOYmet33/outsourcing-project

- 팀 슈퍼베이스 : https://supabase.com/dashboard/project/skoeoscfrrvppqbusqpk/editor/29126

- 팀 피그마 : https://www.figma.com/design/gWJavfc8Z9w2aahpkJMHC5/Camparoo?node-id=0-1&t=uqP8uW96nhfty2Bl-0

(아웃소싱 프로젝트 와이어프레임)

2. 팀회의록 - SA 서면 제출용

1) Code Convention (코드 컨벤션)

  • Javascript Package Manager : yarn (npm 사용x)
  • 전역상태 관리 라이브러리 : Zustand (Redux 사용x)
  • 데이터베이스 : supabase
  • CSS - Tailwind ⇒ 변경) styled-components
  • react-router-dom : verson 6
  • react 코드 사용 예시
const Home = () => {
  return <div>Home</div>;
};

export default Home;

 

2) Github Rules (깃허브룰)

  • 브랜치명 규칙: feature, fix 이후 브랜치명 ex) feature/jeonghun
  • 깃허브 PR 규칙: 절반 이상(과반수)일 경우 merge, PR을 올린 사람이 직접 merge하기

3) 역할 분배 --- 본인 역할만 작성함

  • 팀리더 : 팀회의 주최, 슬랙/깃허브/피그마 오픈
  • 기능구현) 회원가입 페이지 : ID는 email 형식, PW 확인란 추가, 닉네임 설정
  • 기능구현) 로그인 페이지 : Supabase의 Users 테이블 내용과 일치하면 메인페이지로 navigate