반응형 api통신2 리액트 공통API 분리시키기 vocabulary 어플리케이션 만들었을 때 여러 컴포넌트에서 통신을 해야하는 로직이 공통이여서 커스텀 훅을 이용해서 useFetch를 만들었었다. //DayList.jsx function DayList() { const [dayList, setDayList] = useState([]) useEffect(() => { fetch('http://localhost:3003/days') .then(res => { return res.json() }).then(data => setDayList(data)) }, []) ... 요런식으롱? useEffect에 렌더링이 될 때마다 fetch를 했다. days안에 있는 data를 응답받아서 setDayList에 넣었다. [공통으로 만든 useFetch] //useFe.. 2022. 11. 4. 리액트 CRUD 해보기 연습용으로 만든 Dummy데이터는 고정되었기에 사용자의 액션에 따라서 데이터를 읽고 쓰고 업데이트, 삭제해보자! 그러기 위해서는 DB를 구축하고 API를 만들어야하는데, JSON서버를 이용해서 RESTful API를 만들어 보자! [REST API란?] Representational State Transfe uri주소와 메서드로 CRUD요청을 하는 것! 즉 웹 데이터 전송 방식을 말한다. Create : POST Read : GET Update : PUT Delete : DELETE URI는 식별하고, URL은 위치를 가르킨다. URI: 웹 기술에서 사용하는 논리적 또는 물리적 리소스를 식별하는 고유한 문자열 시퀀스 URL: 흔히 웹 주소라고도 하며, 네트워크 상에 리소스가 어디에 있는지 알려주기 위한 .. 2022. 10. 22. 이전 1 다음 728x90 반응형
