뉴스피드란??

내 게시물을 포함한 모든 게시물을 볼 수 있는 공간

ex) 블로그, 커뮤니티, SNS 등

1. 프로젝트 기획

1) 주제 : Workation(work + vacation의 합성어)

2) 페이지 구성

• 페이지는 크게 Home / MyPage 로 나눴다.
  • Home
    • 네비게이션바(로고, 프로필사진)
    • 카테고리(탭)
    • 피드보기
    • 도전과제 : 로그인했을 때 보일 팔로워∙팔로잉
  • MyPage
    • 탭을 내 게시물 / 좋아요 누른 게시물 로 나눠 보여주기로 했다.
    • 도전과제 : 프로필 사진 변경하기
• 나머지 회원가입 및 피드 전체보기, 게시물 작성 폼은 페이지로 구분짓지 않고 모달로 나타내기로 했다.

3) 역할분배

4명의 팀원에서 분배했으며, 나는 피드를 자세히 보여주는 모달을 만들기로 했다.

4) 코드 컨벤션

• 변수: 카멜케이스 (ex. camelCase)
• 함수: 동사/전치사 시작 (ex. countNumber, withUserId)
• 상수: 대문자 (ex. SPECIAL_NUMBER)

5) git 관리방안

브랜치 네임을 분류하고, 커밋할 때 깃모지를 사용하기로 했다.

2. 협업관리 세팅

1) supabase

이번 과제에서는 데이터베이스를 비롯한 백엔드 시스템(BaaS; Backend as a System)을 이용하기 위해서 사용하는 도구를 사용하는 게 목표이다.
해당시스템을 위해 가입하고, 협업자를 초대했으며, vscode에 설치 및 초기세팅을 완료했다.!

2) prettierrc 설정

3) 각종 주요 패키지 설치

yarn create vite Oreo_Workation_Project --template react

yarn

yarn add styled-components

yarn add react-router-dom

4) 기본 라우팅 설정