custom hook2 3/24 일일정리 React Hooks 적용하기 주어진 간단한 React로 만들어진 블로그 코드를 완성시키고, custom hook을 만들어서 리팩토링 해보는 실습을 진행하였다. 이번 실습에는 json server 라이브러리를 사용하였는데, json파일을 이용하여 REST API를 구축해주는 라이브러리이다. 서버를 실행시키고 해당 포트로 들어가면 다음과 같은 화면이 나온다. 해당 서버는 오른쪽의 json파일을 기반으로 만들어졌다. useParams 처음 작업은 react router의 useParams hook을 사용하는 것이었다. 각각의 블로그 글은 router Link로 다음과 같이 작성되어 있다. 콜론(:) 뒷부분이 parameter로 들어오는데, useParams hook을 사용하면 이 parameter를 받아올 수 있다. BlogDetails.. 2023. 3. 24. 3/23 일일정리 Custom Hook Custom Hook Custom Hook이란 개발자가 직접 만든 hook을 말한다. 자주 사용하는 로직을 하나의 함수로 만들어서 Hook과 같이 사용하는 것이다. Custom Hook을 만드는 이유는 반복되는 코드를 줄여서 가독성이 좋아지고, 코드의 재사용성을 높인다. 또한 로직에 문제가 발생했을 때 유지보수하기 좋다. Custom Hook은 일반적으로 use- 로 시작하도록 이름을 지정한다. Custom Hook 만들기 실습 페어와 함께 Custom Hook 만들기 실습을 진행하였다. useFetch Hook Fetch get요청을 해서 data를 받아오는 코드를 Custom Hook으로 작성해봤다. useFetch hook은 fetchUrl을 받아서 데이터를 가져온 후 다른 컴포넌트에서 꺼내어 사용.. 2023. 3. 23. 이전 1 다음