1
00:00:07,600 --> 00:00:10,040
Welcome to brand new section.

2
00:00:10,060 --> 00:00:13,300
And that is Web API.

3
00:00:13,930 --> 00:00:22,090
If you choose to become a front end developer, you need to understand what is web API, meaning how

4
00:00:22,090 --> 00:00:24,220
we can consume API.

5
00:00:24,400 --> 00:00:28,450
Likewise, fullstack developers and then back in developers.

6
00:00:28,450 --> 00:00:31,420
This chaos is really important.

7
00:00:31,690 --> 00:00:38,890
But before we get into that, let's look at the projects that you'll be building while exploring web

8
00:00:38,890 --> 00:00:39,940
APIs.

9
00:00:40,090 --> 00:00:44,620
And the first project is what you call battery application.

10
00:00:44,830 --> 00:00:51,370
And for this, I use the built in API call battery to develop this application.

11
00:00:51,520 --> 00:00:58,000
And this project give more information about your battery in your operating system.

12
00:00:58,270 --> 00:01:06,760
So for me, my battery level is 100% meaning that it is fully charged and we have what is called charging

13
00:01:06,760 --> 00:01:08,950
state and indeed I am charging.

14
00:01:08,950 --> 00:01:10,210
So charging is.

15
00:01:10,210 --> 00:01:15,850
Yes, and then the charging time and then in discharging time minus infinity seconds.

16
00:01:16,090 --> 00:01:20,860
So if I unplug my charger, you're going to see charging to be false.

17
00:01:20,860 --> 00:01:27,190
But because I am using a mac desktop, if I unplug my charger, my screen will be off.

18
00:01:27,220 --> 00:01:30,220
So this is a project that will be built in.

19
00:01:30,250 --> 00:01:34,270
The next one is what we call Get My Location.

20
00:01:34,420 --> 00:01:42,850
And for this I use the geolocation API to build this one and as soon as I click on get my location and

21
00:01:42,850 --> 00:01:51,130
you can see that it has given me my current location and it gives me more details about where I am right

22
00:01:51,130 --> 00:01:51,790
now.

23
00:01:51,940 --> 00:01:59,020
The next project is how to make a HTTP request, and for this one we are going to use the built in API

24
00:01:59,050 --> 00:01:59,950
called fetch.

25
00:02:00,130 --> 00:02:06,070
So when I click on fetch post, let's see the post that we are going to get and you can see that we

26
00:02:06,070 --> 00:02:09,850
go back list of posts from different server.

27
00:02:10,030 --> 00:02:18,100
The next project is what we call task manager application and for this one we are going to use the local

28
00:02:18,110 --> 00:02:20,020
storage to build this.

29
00:02:20,140 --> 00:02:21,580
So let's have a look.

30
00:02:21,580 --> 00:02:29,230
When I add a task, for example, coding and I hit enter, we can see that it has been added to my list

31
00:02:29,230 --> 00:02:38,470
and next week I'm going to be studying and then let's say walk in and so on and so forth and I can go

32
00:02:38,470 --> 00:02:41,110
ahead and then delete these tasks.

33
00:02:41,140 --> 00:02:42,880
Let me add more in the mix.

34
00:02:42,880 --> 00:02:50,530
For example, studying like that and if I refresh my page, you can see that it still persists, meaning

35
00:02:50,530 --> 00:02:54,760
that it's been saved into the local storage of my browser.

36
00:02:55,030 --> 00:03:01,720
So to prove to you if I check my local storage and you can see that this is the to dos, I have our

37
00:03:01,720 --> 00:03:02,080
task.

38
00:03:02,080 --> 00:03:02,830
I have.

39
00:03:02,830 --> 00:03:10,900
And if I add a new task, put your I here is going to be added and I call this one as shopping and I'll

40
00:03:10,900 --> 00:03:15,940
hit enter and you can see that it has been added inside my local storage.

41
00:03:16,150 --> 00:03:22,450
So this is the application that we are going to build while exploring the Web API.

42
00:03:22,570 --> 00:03:27,430
So in this video, let's dive in and explain what is API.