Projects with JSON and APIs

Sign up for a free account on the website.

Get comfortable using the editor/ interface. This is where we will be spending most of our time.

Create some very basic HTML structure for our app.

Add some very basic CSS styling to our app.

Learn what an API is.

Some students have been running into issues with their content not loading, even though they followed my lectures and their code looks identical to mine. In this video I explain how to fix a common issue you may run into in the future projects.

Create a simple app that utilizes an API.

Finish working on the app from the previous lecture.

The Birds API we will be using in the coming lectures now requires you to sign up for an account. This will allow you to receive an API key that you can use when making the API calls in your app.

Learn more about the jQuery.getJSON() method and use it to build another simple app.

Finish the app that we started in the previous lecture.

Use the Reddit API to fetch some photos and display them in our app.

Continuation of the Reddit API app.

Some links to help you understand how flexbox works.

We'll go over the general aspects of an API and wrap up this section.

We will use an API to grab the users IP address.

We will use a custom CSS library to include a nice flag for the user in our app.

The main highlight of our project, the Google Map will be added.

You will notice that in the next lecture, the Google Maps website has changed slightly. One major difference is that Google is now making it mandatory to have billing enabled before using the API, but not to worry–you have a hefty free quota and are able to cancel your billing at anytime!

We will add the API key for our Google Map.

Let's add some nice stylistic touches to make it look better.

Finish up our app!

Back in lecture 6 I told you I would show you how to include Google Fonts in your projects, so here it is. It's really quite simple and easy to implement.