/Assignment1-JC-DW

assignment1(하얀마인드) by 제찬, 동원

Primary LanguageJavaScript

리팩토링 과정

🎯 노션 링크

데모 페이지 링크

🚀 페이지 링크

설치 및 실행방법

yarn 패키지 설치 yarn start 프로젝트 로컬 실행

과제 구현 목록

1. Init

  • CRA 생성
  • 폴더 구조 설계
  • 더미데이터 생성
  • 모듈 세팅

2. styling

  • CommentList 컴포넌트 스타일링
  • CommentLists 컴포넌트 스타일링

3. 전역상태 관리

  • Dummy Data 대신 전역 변수 사용
  • Redux-saga를 이용한 비동기 네트워크 통신

4. Infinity Scroll

  • 페이지별 API 받아오기
  • scroll event를 통해 무한스크롤 구현
  • throttle 이용한 이벤트 제어

폴더구조

📦src  
┣ 📂components -- 컴포넌트 단위의 React 파일  

┣ 📂pages -- 페이지 단위의 React 파일   
┃  
┣ 📂reducers -- 상태를 변화시키는 로직   
┃  
┣ 📂route -- 상태를 변화시키는 로직
┃ 
┣ 📂sagas -- 네트워크 비동기 처리   
┃  
┣ 📂store -- 전역 state 선언   
┃  
┣ 📂utils
┃ 
┣ 📜App.js  
┗ 📜index.js