Idea Generator Tutorial Part 2: Fetching Data with Authentication

Video

Learn to fetch data from an API using authentication as I show you how I build an idea generator app from start to finish using JavaScript, HTML, and CSS. In this part of the tutorial, we focus on the Raindrops.io API, which requires authentication to get data. This intermediate tutorial will help you understand the basics of authentication, how to incorporate authentication into your fetch calls in JavaScript, and how to properly set up your project using the npm dotenv package so you can use Git or other version control methods to track your changes - without committing sensitive data such as authentication keys and secrets. This is part 2 of an 8 part tutorial. Check out the playlist here: https://youtu.be/-Y9Vovf01cI Follow along by cloning or forking the main branch here: https://github.com/ProfessorKolodziej/idea-generator

Chapters in this video:

Introduction
Review and commit your changes to GitHub
Add your authorization key to the .env file
Proper security practices with console.log and tokens
How to write a basic fetch request in JavaScript
Test out grabbing the data from the raindrop.io API
How to debug errors while writing fetch requests in JavaScript
How to add an authorization key to your fetch request
How to view the results of your fetch call in the web inspector
Reviewing the API to find the right endpoint to get bookmarks
Changing the endpoint in the fetch call to get raindrops instead of collections
How to change the number of results you get back from your fetch call
How to add a parameter to a URL
How to write multiple lines in arrow functions
Log out each of the bookmarks using ES6 syntax for the for loop
Conclusion