- 2.We can send arbitrary HTTP requests from any React component to send and retrieve data from external APIs
- 3.Understand how to send HTTP requests from React components and where to send them
- 2.The examples fetch first-load data in
useEffectinstead of in
renderor directly in the functional component to avoid fetching data every time the component re-renders
res.json()extracts the JSON object out of the response.
resultin the subsequent callback contains that object.
- 4.The examples show how to send AJAX requests to populate data in components on component load, but not how to send requests on a user action such as a button click (e.g. like button). For the latter we can safely define a callback method in our component (e.g.
handleClick) that performs a request on button click without worrying about fetching data more times than necessary.
Fetch and React Intro
Fetch and React Call Data
Fetch and React Display Data
React and Axios
Please checkout the finished code in this repository, if you want to test out the application on your machine you will need to install the dependencies with the command
npm installafter the installation you can then run the application with the command
npm start, see if you are able to alter the
handleSubmitmethof to use