본문 바로가기
프로그래밍

wecode (10/10)

by Youngbin Kwon 2020. 10. 11.

배운 것/개발한 것/정리한 것

- redux

코드 리뷰 받은 사항 반영 : fetch 함수를 굳이 store에 저장하지 말고, 각 컴포넌트 내에서 정의한 후 getClasses 함수만 store에서 dispatch로 꺼내 쓰기

 

 const allClassData = useSelector((state) => state.allClasses);

  useEffect(() => {
    getAllClasses(dispatch);
    fetch(`http://localhost:3000/Data/classesMOCK.json`)
      .then((res) => res.json())
      .then((res) => {
        dispatch(getClasses(res.data));
      });
  }, []);

 

- 슬라이더 애니메이션 완성

react slick의 property 중 하나인 currentSlide (현재 슬라이드값)을 가져와서 해당 요소가 바뀔 때마다 진행 바를 리셋해주는 것으로 완성

* 함수형 컴포넌트에서 callback을 사용하는 방법은 useEffect를 두 번 사용하는 것 밖에 없는 것일까? (추후 찾아보기)

 

const Slider = ({ length, id, thumbnail, name, currentSlide }) => {
  const [value, setValue] = useState(0);

  useEffect(() => {
    console.log(currentSlide);
    setValue(0);
  }, [currentSlide]);

  useEffect(() => {
    setValue(100);
  }, [value]);

 

내일 할 것

1. 크리에이터 센터 공통 컴포넌트 레이아웃 만들기

2. 블로깅

  • redux 개념 정리하기

댓글