frontend/react (2) 썸네일형 리스트형 [React] React Hook 사용하기 - useMemo, useCallback 깃헙 TIL 레파지토리에 올릴까 하다가 내용이 길어질 것 같아서 그냥 블로그에 올리기로 결심했다 . . . TIL을 마크다운 언어로 작성하다보니, 적은 내용이더라도 시간이 엄청 소요된다 ㅜㅜ 사실 블로그 포스팅도 좀 귀찮은데 그래도 안 쓰면 또 까먹을 것 같으니 포스팅해본다! 사실 그렇게 대단한 내용은 아니라서 블로그에 올릴 거리가 되나 싶긴 하지만 그래도 뭐든 과정에서 배운 점이 있다면 기록해둔다고 나쁠 것 없을 것 같다 우선 이번에 보여줄 코드는 Next 스터디(라고 하기에는 사실상 React 스터디)로 간단한 TODO 앱을 만들고 있는데, 이 과정에서 렌더링이 너무 무분별하게 발생하는게 꽤 거슬렸다. 따라서 기능을 더 추가하기 전에 React Hook을 사용하여 렌더링 횟수를 조금 줄여보았다. 우선.. [React] 여러 개의 input 태그 관리와 setState 벨로퍼트 리액트 튜토리얼 input 태그 부분(https://react.vlpt.us/basic/09-multiple-inputs.html)을 공부하는 중에 이해가 안 되는 부분이 있었다. 특히 const onChange = (e) => { const { value, name } = e.target; setInputs({ ...inputs, // 기존의 input 객체를 복사 [name]: value // name 키를 가진 값을 value로 설정 }); }; 이 부분을 이해하기가 어려웠다. ☝ 첫 번째로는 ...inputs ✌ 두 번째로는 [name]: value 부분이다. 강의 자료에 달린 사람들의 댓글과 구글링을 통해 내 나름대로 해당 내용들을 정리할 수 있었다. ☝ Spread(...) 연산자 우.. 이전 1 다음