원티드 프리온보딩 프론트엔드 코스 6차 과정

총 5주 (2022.8.30 - 9.30)
11팀 repositories

---

과제 1 - 선발 과제(투두 리스트)의 Best Pratice 산출

Github

과제 목적

• 동료학습, 팀으로 일하는 법에 익숙해지는 것
• 각자 구현한 결과물을 통해 토론하면서 특정 문제를 어떻게 해결하는게 가장 좋은 방안인지 토론
• Git Commit Message, History 관리

사용 기술

• TypeScript, React, React-Router-Dom, Styled-Components, Axios, Context API

나의 선발과제 Github with JS
나의 선발과제 Github with TS

---

과제 2 - Fruitte의 스토어 리뉴얼 개발

Github

사용 기술

• TypeScript, React, React-Router-Dom, Styled-Components, Axios, Recoil

프로젝트 진행 방법

• 취합 시 충돌과 혼동을 피하기 위해 page 단위로 2명씩 팀원을 배정, 해당 page 디렉토리 내에서 모두 개발 후 취합

담당 역할

• admin 상품 목록 페이지

작업 commits

---

과제 3 - 영화 트레일러 사이트 만들기

Github

사용 기술

• TypeScript, React, React-Router-Dom, Styled-Components, Axios, React-Query

프로젝트 진행 방법

• 역할을 나누고 개발 완료 후 취합

담당 역할

• 영화 상세 페이지 구현, Header 구현

작업 branches

• movie-detail-page -> VSCode의 live share 기능 활용
• header

---

과제 4 - 특정 깃헙 레파지토리(angular-cli)의 이슈 목록과 상세 내용을 확인하는 웹 사이트 구축

Github

사용 기술

• TypeScript, React, React-Router-Dom, Styled-Components, Context API, intersection observer, React-Markdown

프로젝트 진행 방법

• 역할을 나누고 개발 완료 후 취합

담당 역할

• 이슈 목록 페이지 구현

작업 branch

• design-issue-list-page -> VSCode의 live share 기능 활용

---

과제 5 - API 서버와 통신해서 작동하는 댓글 프로젝트를 Redux를 통해 구현

Github

사용 기술

• TypeScript, React, Styled-components, Axios, Redux-Toolkit, React-Redux, Redux-Logger, Redux-Devtools

프로젝트 진행 방법

• 역할을 나누고 개발 완료 후 취합

담당 역할

• CommentList component 구현

작업 branches

• comment-list -> VSCode의 live share 기능 활용
• comment-reducer -> VSCode의 live share 기능 활용

---

과제 6 - 투자 관리 서비스의 관리자 기능 구현

Github

사용 기술

• TypeScript, React, React-Router-Dom, React-Query, Styled-Components, Axios, Ant Design

프로젝트 진행 방법

• 각자 구현해보고 Best Practice를 산출한 뒤에 리팩토링하거나 부족한 부분을 채우는 방식

작업 branches

• jinwoo
• header
• sider

---

과제 7 - 검색창 구현 + 검색어 추천 기능 구현

Github

사용 기술

• TypeScript, React, Styled-Components

프로젝트 진행 방법

• 각자 구현해보고 Best Practice를 산출한 뒤에 리팩토링하거나 부족한 부분을 채우는 방식

작업 branch

• jinwoo