나의 개발일지

[React/TypeScript] 최종프로젝트 - Mango(환경오염 줄이기 / 지구 살리기 프로젝트!) (진행 중) 본문

과제 및 팀프로젝트

[React/TypeScript] 최종프로젝트 - Mango(환경오염 줄이기 / 지구 살리기 프로젝트!) (진행 중)

heew0n 2024. 1. 5. 10:29

🔥 React / TypeScript  최종프로젝트🔥

 

 

개발 기간

2024.01.04 - 2024.02-07

 

프로젝트 명

망고(Mango) - 망해가는 지구를 고치자..!

 

프로젝트 소개

환경오염을 줄이는 다양한 팁과 정보를 제공하고 공유하는  '친환경 라이프' 사이트

  1. 환경보호 생활 습관 정보 제공
  2. 환경보호 제품 추천/무료나눔
  3. 나의 환경보호 습관(실천) 캘린더 관리
  4. 웹사이트를 소개하면서 환경오염에 관한 뉴스/영상 등 정보 제공

기술스택

  • React
  • Firebase
  • Typescript
  • React-query / recoil

 

 

👤팀원 소개 및 WBS & Tasks (추후 각자 맡게될 기능을 더 추가할 예정)

리더 : 박혜민(Ashley)

  • Write: 게시글 업로드
  • 에디터 라이브러리를 활용하여 사람들이 게시글을 올릴 때 원하는 형태를 적용할 수 있는 기능 제공
  • 해시태그: 전체 게시글을 서핑하는 사용자가 읽고 싶은 게시글을 조금 더 간편하게 발결할 수 있도록 게시글을 올릴 때 여러 해시태그를 적용할 수 있는 기능

부리더 : 김혜민(Kim)

  • Main-sub: 전체 게시물 리스트
  • 카테고리 별로 탭을 눌러 볼 수 있음(Filtering)
  • 최신순, 좋아요를 많이 받은 인기순으로 볼 수 있음(Sorting)
  • 더보기를 누르면 보여진 6개 단위로 게시글을 추가적으로 볼 수 있음

팀원 : 박솔이(Soli)

  • Main: 첫 랜딩페이지
  • 다양한 swiper UI를 구현하고,
  • 좋아요 개수가 높은 상위 랭킹 게시글(Sorting)
  • 전체적으로 좋아요 개수를 많이 받은 사용자 랭킹 (Sorting)

팀원 : 박희원(Hailey)

  • Mypage: 나의 게시글과 습관 기록을 한 눈에 볼 수 있음
  • 나의 게시글 보기 (auth based filtering)
  • 캘린더 보기 (캘린더 라이브러리 활용)
  • 습관 인증 게시물을 올릴 때마다 캘린더에 스티커 개수가 올라가도록 firebase database와 연동

 

 

🐣 Ground Rules

- 기타 소통 방식 (예, 부재 시)

- 20분 초과 시 슬랙에 공유하기; 미만 시 젭에서 춤추기

- 호칭: 닉네임 + 님 - 잘 안 되는 코드는 미리 고민 후에 공유하기

- 안될 때 튜터님 같이 찾아가기 - 7시 머지할 때 코드 line by line 설명해주기

- 기능 세부적으로 쪼개서 기한 정하기: 기한 내 불가한 경우 소통하기

- google spreadsheet로 기한 모니터링 및 진행상황 기록

 

 

 

와이어프레임