본문 바로가기

전체14

5) 리액트에서 API 요청하기 SWR 자, 이제 리액트에서 API를 요청하기 위한 준비를 해보겠다. 일반적으로 리액트에서 많이 쓰이는 Ajax API 통신용라이브러리는 1.브라우저에 내장된 window.fetch 2. Axios 3. Jquery Ajax등이 있다. 이번에 나는 React hooks에 최적화됐다는 SWR이라는 녀석을 써보기로 한다. https://swr.vercel.app/ SWR: React Hooks for Data Fetching SWR is a React Hooks library for data fetching. SWR first returns the data from cache (stale), then sends the fetch request (revalidate), and finally comes with the.. 2020. 7. 17.
4)날짜 처리하기 date-fns 앞서 코로나 바이러스 API를 살펴보니 날짜라는것이 필요해졌다. 자바스크립트에서는 날짜를 다음처럼 처리한다. var date = new Date(); //Thu Jul 16 2020 23:27:34 GMT+0900 (Korean Standard Time) 이런식으로 생성하는데 2020-07-16으로 포맷을 일일이 바꿔주는것은 상당히 귀찮은 일이다. node에는 여러가지 날짜를 처리하는 라이브러리들이 있는데 이중에서 date-fns라는 라이브러리를 사용해보겠다. https://date-fns.org/ Modern JavaScript Date Utility Library date-fns provides the most comprehensive yet simple and consistent toolset fo.. 2020. 7. 16.
3) 코로나바이러스 무료 api 테스트하기 우리가 만들 앱은 코로나 바이러스 현황을 조회하는 무료 API를 사용할 것이다. https://rapidapi.com/api-sports/api/covid-193 로그인을 마치면 위와 같은 화면이 나올텐데 왼쪽의 API 리스트를 살펴보니 3개의 method가 있다. Statistics는 국가별 코로나바이러스 통계를 보여준다. Countries는 코로나 정보를 가진 국가리스트를 보여준다. history는 날짜와 국가 parameter로 코로나 기록을 보여준다. 해당 API를 이제 테스트해 볼텐데 여기선 Insomnia라는 도구를 사용해서 해볼것이다. https://just-coding.tistory.com/7 Insomnia. API 테스트 도구 사용하기 다른사람이 만든 API를 테스트할때 일일이 터미널에.. 2020. 7. 16.
Insomnia. API 테스트 도구 사용하기 다른사람이 만든 API를 테스트할때 일일이 터미널에서 리퀘스트를 보내는것은 피곤한 일이다. 쉽고 간편하게 만들어진 도구를 사용해 테스트해 보자. https://insomnia.rest/ Insomnia Design & Debug APIs like a human, not a robot insomnia.rest 나는 Insomnia core를 선택해서 다운로드 받았다. 테스트도 해볼겸 naver.com으로 GET 요청을 보내보았다. 2020. 7. 16.