1
00:00:00,000 --> 00:00:04,797
[MUSIC]

2
00:00:04,797 --> 00:00:06,590
When writing asynchronous code,

3
00:00:06,590 --> 00:00:10,485
you're basically providing the program
sets of instructions to run later

4
00:00:10,485 --> 00:00:14,402
in response to an event, a data request,
or a specified interval of time.

5
00:00:14,402 --> 00:00:15,380
Because of this,

6
00:00:15,380 --> 00:00:20,159
asynchronous code is typically structured
in a different way than synchronous code.

7
00:00:20,159 --> 00:00:24,499
One of the most fundamental ways to
structure async programs in JavaScript is

8
00:00:24,499 --> 00:00:26,046
with callback functions.

9
00:00:26,046 --> 00:00:27,919
Callbacks are prevalent in JavaScript,

10
00:00:27,919 --> 00:00:31,296
you'll encounter them in just about
all of your JavaScript development.

11
00:00:31,296 --> 00:00:36,917
Remember, a callback is a function that is
passed to another function as an argument,

12
00:00:36,917 --> 00:00:41,315
and it only runs after its parent
function has finished executing.

13
00:00:41,315 --> 00:00:45,412
In this stage, I'll teach you how to
use callbacks to handle the results of

14
00:00:45,412 --> 00:00:48,860
asynchronous operations,
as well as some of the drawbacks and

15
00:00:48,860 --> 00:00:50,827
potential pitfalls of using them.

16
00:00:50,827 --> 00:00:53,832
But first,
let's go over what you're going to build.

17
00:00:53,832 --> 00:00:55,755
In this course, you'll learn and

18
00:00:55,755 --> 00:01:00,077
practice writing asynchronous JavaScript
by creating a simple API mashup.

19
00:01:00,077 --> 00:01:04,989
Meaning a site or app that's created
using two data sources, in this case,

20
00:01:04,989 --> 00:01:07,771
the Open Notify API and the Wikipedia API.

21
00:01:07,771 --> 00:01:12,512
The app fetches and displays data about
every astronaut who is currently in space.

22
00:01:12,512 --> 00:01:16,605
In the app, when a user clicks
the View all the People button,

23
00:01:16,605 --> 00:01:18,907
three things are going to happen.

24
00:01:18,907 --> 00:01:22,175
First, make a request to
the open-notify.org API,

25
00:01:22,175 --> 00:01:25,938
which is going to return the current
number of people in space,

26
00:01:25,938 --> 00:01:29,577
including their names and
the spacecraft that they're on.

27
00:01:29,577 --> 00:01:32,722
Then that data will be used
to make a second request,

28
00:01:32,722 --> 00:01:37,509
this time to the summary endpoint of the
Wikipedia API to get more data about each

29
00:01:37,509 --> 00:01:40,661
astronaut, like their picture,
bio, and title.

30
00:01:40,661 --> 00:01:44,294
Finally, it's going to display
each astronaut on the page using

31
00:01:44,294 --> 00:01:46,219
the data returned from both APIs.

32
00:01:46,219 --> 00:01:50,059
Fetching data like this is one of the most
common ways you will write asynchronous

33
00:01:50,059 --> 00:01:51,308
programs in JavaScript.

34
00:01:51,308 --> 00:01:53,102
You'll start by working with callbacks.

35
00:01:53,102 --> 00:01:56,964
But before you begin learning about
callbacks in an asynchronous context,

36
00:01:56,964 --> 00:01:59,739
you're going to review what
callback functions are,

37
00:01:59,739 --> 00:02:03,497
along with some of the ways functions
could be passed to other functions.