Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
In this course, you'll learn and practice writing asynchronous JavaScript by building a simple API mashup, which is a site or app thatβs created using two data sources.
Resources
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
[MUSIC]
0:00
When writing asynchronous code,
0:04
you're basically providing the program
sets of instructions to run later
0:06
in response to an event, a data request,
or a specified interval of time.
0:10
Because of this,
0:14
asynchronous code is typically structured
in a different way than synchronous code.
0:15
One of the most fundamental ways to
structure async programs in JavaScript is
0:20
with callback functions.
0:24
Callbacks are prevalent in JavaScript,
0:26
you'll encounter them in just about
all of your JavaScript development.
0:27
Remember, a callback is a function that is
passed to another function as an argument,
0:31
and it only runs after its parent
function has finished executing.
0:36
In this stage, I'll teach you how to
use callbacks to handle the results of
0:41
asynchronous operations,
as well as some of the drawbacks and
0:45
potential pitfalls of using them.
0:48
But first,
let's go over what you're going to build.
0:50
In this course, you'll learn and
0:53
practice writing asynchronous JavaScript
by creating a simple API mashup.
0:55
Meaning a site or app that's created
using two data sources, in this case,
1:00
the Open Notify API and the Wikipedia API.
1:04
The app fetches and displays data about
every astronaut who is currently in space.
1:07
In the app, when a user clicks
the View all the People button,
1:12
three things are going to happen.
1:16
First, make a request to
the open-notify.org API,
1:18
which is going to return the current
number of people in space,
1:22
including their names and
the spacecraft that they're on.
1:25
Then that data will be used
to make a second request,
1:29
this time to the summary endpoint of the
Wikipedia API to get more data about each
1:32
astronaut, like their picture,
bio, and title.
1:37
Finally, it's going to display
each astronaut on the page using
1:40
the data returned from both APIs.
1:44
Fetching data like this is one of the most
common ways you will write asynchronous
1:46
programs in JavaScript.
1:50
You'll start by working with callbacks.
1:51
But before you begin learning about
callbacks in an asynchronous context,
1:53
you're going to review what
callback functions are,
1:56
along with some of the ways functions
could be passed to other functions.
1:59
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up