반응형 axios2 리액트 공통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. comments에 대한 CRUD 요청 만들어보기 GET, POST, PUT, DELETE 메서드로 comment 에 대한 각각의 요청을 구현해보자! [사용된 환경] - json-server - Axios [테스트 순서] 1. json-server npm install 1-2. db.json 파일 생성 3. axios로 비동기통신 4. 서버와 통신해보기 🔶 1. json-server 사용하기 기본 사용 참고 사이트 json-server는 REST API를 구축해주는 라이브러리이다. REST API 서버의 기본적인 기능을 갖추고 있지만 산업용은 아니고 서버 통신 TEST용도로 쓰인다. 🔹1) 설치하기 https://www.npmjs.com/package/json-server json-server Get a full fake REST API with zer.. 2022. 8. 31. 이전 1 다음 728x90 반응형