Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- 특성선택자
- Til
- 깃허브오류
- 의사클래스
- 부트캠프 #스파르타코딩클럽 #개발일지# #html
- 부트캠프 #개발일지 #TIL #CSS속성 #float #clear
- 개발일지
- React
- 부트캠프 #CSS #개발일지 #TIL #박스모델
- 부트캠프 #코딩 #개발일지 #프론트엔드 #CSS #TIL
- 부트캠프 #스파르타코딩클럽 #개발일지# #TIL #Javascript #confirm #location.href
- 알고리즘
- 부트캠프 #개발일지 #TIL #그리드 #CSS
- useState
- 부트캠프 #CSS #개발일지 #TIL
- js
- 템플릿스트링
- 부트캠프 #개발일지 #TIL #FlexboxFroggy #displayflex #flexbox
- appendChild
- CSS
- useEffect
- textContent
- 부트캠프 #개발일지 #TIL #Position #위치
- 결합선택자
- JS예제
- 부트캠프
- 개발일지 #TIL #프론트엔드 #HTML
- 리액트
- ㅜㄹㄹ
- querySelector
Archives
- Today
- Total
나의 개발일지
[React/TypeScript] 최종프로젝트 - Mango(환경오염 줄이기 / 지구 살리기 프로젝트!) (진행 중) 본문
과제 및 팀프로젝트
[React/TypeScript] 최종프로젝트 - Mango(환경오염 줄이기 / 지구 살리기 프로젝트!) (진행 중)
heew0n 2024. 1. 5. 10:29🔥 React / TypeScript 최종프로젝트🔥
개발 기간
2024.01.04 - 2024.02-07
프로젝트 명
망고(Mango) - 망해가는 지구를 고치자..!
프로젝트 소개
환경오염을 줄이는 다양한 팁과 정보를 제공하고 공유하는 '친환경 라이프' 사이트
- 환경보호 생활 습관 정보 제공
- 환경보호 제품 추천/무료나눔
- 나의 환경보호 습관(실천) 캘린더 관리
- 웹사이트를 소개하면서 환경오염에 관한 뉴스/영상 등 정보 제공
기술스택
- 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로 기한 모니터링 및 진행상황 기록
와이어프레임