SEB Section2 ha를 마치고

Section2

Section2가 끝났다. Section2를 하면서, 리액트에 대해 많이 알아가는 과정이었다. 데이터의 흐름, 상태관리 등을 배우면서 리액트도 까다롭지만, 블럭을 맞춰 끼우는 느낌이 들어 매력적이고, 재미있는 언어라고 느꼈다. 아직은 미숙하지만 미니 프로젝트를 하면서 리액트와 express를 익히는 과정을 거쳐야 한다고 생각했다.

Ha Section2

Ha를 풀면서 코플릿은 비교적 쉬운 문제가 나왔고, 문제 수가 적어 더 문제가 있는 것이 아닌가? 생각이 들었다. 또한 퀴즈형 문제 역시 크게 문제가 되는 것은 없었다. 과제형 문제에서 조금 문제가 있었다.

• useEffect 이용시 무한 렌더링

useEffect는 sideEffect로 인해 state가 갱신이 될 때 렌더링이 되도록 하는 장치이다. 두 번째 인자에 빈 배열을 넣을 수 가 있고, 값을 넣을 수 도 있다.

useEffect(() => {
  // ~~~
}, [State]);

이렇게 넣어 상태가 갱신이 될 때 마다 렌더링이 되도록 하였다. 하지만 fetch를 해서 인지, api를 통해 데이터가 들어 올 때 마다 렌더링이 되는 현상을 발견했다.

이 때는 api를 통해 데이터를 받아 올 때 한번 만 렌더링이 되도록 하는 방법은 두 번째 인자에 [] 빈 배열을 넣는 것이다. 빈 배열을 넣었더니 해결이 되었다.