| 정소이 | 서진만 | 신명화 | 전선용 |
|---|---|---|---|
 |
 |
 |
 |
- 🎯 목표
✈️ 프로젝트 소개- 📅 일정
- 🎮 프로젝트 사용법
- 🐈 기술 스택
- 🎥 화면 구성
- ⚙️ 주요 기능
- 🔪 컨벤션
- 📂 디렉토리 구조
- 🙉🙈🙉 프로젝트 회고
- 👨💻👩💻 Support 연락 경로(E-mail , Github)
- 프로젝트 초기 단계 경험
- 프로젝트 진행 중에 예상치 못한 요구사항, 에러 상황을 대처하고 해결하는 능력 향상
- 리펙토링을 거쳐 코드를 최적화, 개선하는 작업 경험
Redux와Supabase를 활용하여 프로젝트 만들어 보기
Redux, Supabase, YouTube Data API 를 활용하여
동영상 시청이 가능한 반응형 웹 사이트 제작
🗓️ 기획 기간 : 2023.11.20 ~ 2023.11.20
🗓️ 개발 기간 : 2023.11.21 ~ 2023.12.01
$ npm start
$ npm install @supabase/supabase-js
| 메인 페이지 | 디테일 페이지 |
|---|---|
 |
 |
- 메뉴바 - 호버 라이트/다크모드
- 전체 페이지 - 다크모드
- 메인/검색 페이지 - 검색기능
- 썸네일 애니메이션
- 디테일페이지 - 반응형 모바일
- 디테일페이지- 관련 영상 리스트 스크롤
- 디테일페이지 - 댓글기능
| 호버 라이트모드 | 호버다크모드 |
|---|---|
 |
 |
-
Desktop
-
(Mobile)
📦src
┣ 📂assets
┃ ┣ 📜common-*.svg
┃ ┣ 📜detail-*.svg
┃ ┗ 📜profile.jpg
┣ 📂components
┃ ┣ 📜CommentItem.tsx
┃ ┣ 📜HeaderButton.tsx
┃ ┣ 📜NavButton.tsx
┃ ┗ 📜Spinner.tsx
┣ 📂hooks
┃ ┣ 📜DarkMode.tsx
┃ ┣ 📜HeaderBackButton.tsx
┃ ┣ 📜HomeLogo.tsx
┃ ┗ 📜SearchButton.tsx
┣ 📂layouts
┃ ┣ 📜Header.tsx
┃ ┣ 📜MenuBar.tsx
┃ ┗ 📜NavBar.tsx
┣ 📂pages
┃ ┣ 📜DetailPage.tsx
┃ ┣ 📜ErrorPage.tsx
┃ ┣ 📜MainListPage.tsx
┃ ┗ 📜SearchPage.tsx
┣ 📂reducers
┃ ┣ 📜dataReducer.ts
┃ ┣ 📜detailReducer.ts
┃ ┣ 📜navReducer.ts
┃ ┣ 📜searchHistoryReducer.ts
┃ ┣ 📜searchReducer.ts
┃ ┣ 📜themeReducer.ts
┃ ┗ 📜toggleReducer.ts
┣ 📂store
┃ ┗ 📜store.ts
┣ 📂types
┃ ┣ 📜index.d.ts
┃ ┗ 📜reducer.d.ts
┣ 📜App.test.tsx
┣ 📜App.tsx
┣ 📜client.ts
┣ 📜GlobalStyles.ts
┣ 📜index.tsx
┣ 📜react-app-env.d.ts
┣ 📜reportWebVitals.ts
┣ 📜RootLayout.tsx
┣ 📜rootReducer.ts
┣ 📜Router.tsx
┣ 📜setupTests.ts
┗ 📜theme.ts
| 이름 | 회고내용 |
|---|---|
| 정소이 | 2주 동안 Redux를 경험해보면서 에러 원인을 정확히 예측할 수 없어 힘들었지만, reducer 생성을 통한 상태 관리 방법과 여러 에러 상황을 알고 사용법을 알았다는 점에 의의가 있었습니다. 또한 팀원 모두 GitHub 관리를 마스터한 점이 뿌듯했습니다. 다음 프로젝트에서는 이를 바탕으로 상태 관리 방법을 개선하고 Styled-component를 목적에 알맞게 사용하고 싶습니다. 3주도 화이팅합시다 :9 |
| 서진만 | [Styled-component] 와 [Redux]를 처음으로 사용해 보면서 어려움이 있었지만 관련 문서들과 참고차료를 통하여 해결 할 수 있었고 여러 기술들을 사용해 보면서 사용자 경험 을 개선하는 방식을 배울 수 있었습니다. 여러분 모두 수고 하셨습니다! |
| 신명화 | 처음 이용하는 리덕스, supabase의 여러 어려움이 있었지만 공식문서를 읽으면서 문제해결을 하는 방법을 알 수 있었고 해결과정에서 팀원들의 도움을 받아 잘 마무리 지을 수 있었습니다 새로운 것을 접함에 대한 두려움을 해결할 수 있는 용기를 얻는 좋은 시간이 되었습니다. 감사합니다. |
| 전선용 | 처음의 나보단 많이 성장한 나를 발견할 수 있게되는 좋은 경험이였고, 앞으로 더 성장할 수있다고 생각한 경험이었습니다. 2주밖에 안되는 시간이였지만 남은 3주도 포기하지않고 화이팅 넘치게 해보겠습니다. 감사합니다. |