Getting Data Using APIs with JS and Fetch

Today’s topics

• Using JSON for data
• Basics of HTTP requests
• Make GET requests with Insomnia client
• Make GET requests using the Fetch API and display response data on a page

Project

Create a GitHub Profile

Link to assignment invitation

🔖 Resources

HTTP

• MDN: HTTP Messages

APIs

• Illustrated Dev: Meet the Robowaiter APIs Serving Us Data
• Insomnia client
• GitHub API Docs

AJAX & Fetch

• AJAX explained by analogy
• MDN AJAX
• MDN Fetch API
• MDN fetch() method
• CSS-Tricks article on using Fetch

⭐ EXTRA/TMI

Fetch requests use JavaScript promises to handle responses. This is a much bigger topic than we will get into right now, but if you want to know more about what a promise is and how to use it beyond the context of AJAX requests, you can start with the MDN documentation about it.

• MDN JS Promise

Code and Videos

• Fetch example from class This includes an additional more complex set of requests that we did not go over in class. Read it over to see what you make of it.
• Morning class video Access Passcode: zjg#%4h.
• Afternoon class video Access Passcode: Q&Hz2++X