지금까지는 기본적인 부분 위주로 공부를 했어요. 마지막 주차에서는 React의 추가 개념과 third-party 라이브러리를 알아봅시다!

여러분의 공부를 돕기 위해 준비한 자료들이에요. 따라서 꼭 준비된 자료만 공부할 필요는 없어요! 자신만의 방식으로 공부하고 과제만 잘 수행하면 돼요! 😄

📚 공부할 내용

  • React 학습
    • UI 표현하기
    • 상호작용성 더하기
      • 객체, 배열로된 state 관리하기, state, react의 렌더링 개념
    • State 관리하기
      • State의 활용 방법, props drilling이 발생할 때 해결 방법, useReducer?
      • 다만 Context API는 변한 값을 사용하지 않았음에도 불구하고 리렌더링이 발생하는 문제가 있어요.
    • 탈출구
      • Ref, Effect의 올바른 사용법
  • Third party
    • zustand
      • zustand 사용법
      • zustand 코드 살펴보기
        • Context API를 사용하지 않는 이유, zustand 사용 방법, zustand 파헤쳐보기 위주로 봐주세요!
      • 위에서 언급한 Context API의 단점을 해결한 상태관리 라이브러리로 단순한 구조를 가지고 있어요!

🎯 프로젝트 실습

  1. 기존 프로젝트에서는 react hook인 useState를 사용해서 상태관리를 했는데 이를 zustand로 바꿔봐요!
  2. React 학습 후 기존 코드를 좀 더 나은 방식으로 구현해보세요!
    1. 예) 기존엔 배열 state 업데이트를 push, unshift를 사용했다면 concat과 […arr] 전개 연산자로 바꿔봐요!
    2. 바꿀 부분이 없다면 기존에 잘 작성한 코드들의 사례를 공유해주세요!