1
00:00:00,330 --> 00:00:01,410
Not bad, not bad.

2
00:00:01,740 --> 00:00:08,400
I think we clearly covered our two options, so we want to send back the jets on there and the second

3
00:00:08,400 --> 00:00:10,080
one is over surrendering.

4
00:00:10,530 --> 00:00:15,660
So why don't we start by covering the most basic Jason response?

5
00:00:16,020 --> 00:00:21,300
And here's what I'm trying to mimic if you go to your core CPI.

6
00:00:22,250 --> 00:00:28,400
And then if you look forward to this project, you'll hit the wall, of course, and here you can see

7
00:00:28,400 --> 00:00:35,020
that we're getting back address and there is an array and each object represents a tour.

8
00:00:35,390 --> 00:00:40,670
And if you took my right course, you know that we were practicing there fetching and react.

9
00:00:41,090 --> 00:00:48,800
And effectively, we hit this Uhara and we got the data, we got our Drayson data back, and then we

10
00:00:48,800 --> 00:00:51,430
built an app using that data.

11
00:00:52,040 --> 00:00:56,990
But again, the whole point here is following where it doesn't have to be react.

12
00:00:57,780 --> 00:01:06,120
It can be vanilla JavaScript application, it can be svelte verimark, it can be any setup where you're

13
00:01:06,120 --> 00:01:08,220
able to fudge that data.

14
00:01:08,700 --> 00:01:12,150
So in here on a server, we just share a.

15
00:01:13,350 --> 00:01:20,340
So in this case, of course, that osterhaus and then anywhere, anyone who wants to access this data,

16
00:01:20,610 --> 00:01:24,860
they can just access it and build something using that there.

17
00:01:24,870 --> 00:01:27,780
And that's why it is so, so powerful.

18
00:01:28,660 --> 00:01:34,450
And essentially, this is what we're going to do, we're just going to send back first a most basic

19
00:01:34,450 --> 00:01:39,020
array and then we'll see how we can make this more dynamic.

20
00:01:39,280 --> 00:01:40,730
Please keep in mind two things.

21
00:01:40,750 --> 00:01:44,290
First, of course, eventually we will use database for that.

22
00:01:44,660 --> 00:01:49,470
And of course, I will mention that probably 20 thousand times as we're building these examples.

23
00:01:49,990 --> 00:01:57,700
And the second thing that I would like you to understand that when it comes to express basics, so essentially

24
00:01:57,700 --> 00:02:03,670
how we set up the server, it doesn't really matter whether we're using server side or whether we're

25
00:02:03,670 --> 00:02:04,450
using JSON.

26
00:02:04,450 --> 00:02:11,410
Again, if we understand the principles, we'll have no problem using any of those options.

27
00:02:11,800 --> 00:02:15,430
So, first of all, I would want ears to navigate back to my project.

28
00:02:15,430 --> 00:02:19,960
And again, this is going to be the time where I do write everything from scratch.

29
00:02:19,970 --> 00:02:26,560
But then starting with the next example, I'll just use some options that we already covered.

30
00:02:26,800 --> 00:02:29,710
So for now, yes, I'll remove everything.

31
00:02:29,710 --> 00:02:32,650
And again, we'll set up Express one last time.

32
00:02:32,920 --> 00:02:41,080
So we're going to go with Express require and express some then const app is equal to require or I'm

33
00:02:41,080 --> 00:02:41,970
sorry, not require.

34
00:02:42,370 --> 00:02:47,230
We need to invoke the express like show and then let's go with Abdah.

35
00:02:47,230 --> 00:02:52,660
Listen board five thousand and then let's call our callback function.

36
00:02:53,480 --> 00:03:00,470
And then let's go again with council log and server is listening on port.

37
00:03:01,370 --> 00:03:06,040
On port and of course, the port number is 5000.

38
00:03:06,530 --> 00:03:14,210
Then again, I want to set up that get because that is the objective method that all browsers perform

39
00:03:14,300 --> 00:03:14,990
by default.

40
00:03:15,230 --> 00:03:19,360
So I'm going to go with that get and I'm not going to go with a specific path.

41
00:03:19,370 --> 00:03:20,840
Just keep in mind that you can.

42
00:03:20,930 --> 00:03:22,340
And of course, we'll do that later.

43
00:03:22,370 --> 00:03:29,120
For example, I can go here with API and I don't know, I can call this product or whatever for the

44
00:03:29,120 --> 00:03:29,600
time being.

45
00:03:29,600 --> 00:03:33,410
Let's just make it simple and we'll just handle all the route requests.

46
00:03:33,410 --> 00:03:36,390
So that way we can save a little bit of typing in the browser.

47
00:03:36,650 --> 00:03:42,010
And again, we have our function on callback function, Iraq and RES.

48
00:03:42,320 --> 00:03:49,090
And as far as the response, we're going to go with Araz and the method name is Jason.

49
00:03:49,730 --> 00:03:55,880
Now we will go to the docs just to understand where I'm getting this information from.

50
00:03:56,370 --> 00:04:02,510
But before we do that, let me just tell you that I might comment here and there, the status one,

51
00:04:02,750 --> 00:04:05,510
just so we can save a little bit of typing.

52
00:04:05,750 --> 00:04:11,510
But don't worry, once we go to some more serious examples, of course, we'll still use the statuses,

53
00:04:11,810 --> 00:04:18,950
because in my opinion, that is just a better approach where we actually have control over the status.

54
00:04:19,370 --> 00:04:25,640
And as far as documentation, if we go back to the condition, we're looking for API reference again,

55
00:04:25,640 --> 00:04:28,480
we are using four point something.

56
00:04:28,580 --> 00:04:30,920
So we are using version four.

57
00:04:31,190 --> 00:04:35,870
So make sure you look for the same one and don't confuse with Express Jason.

58
00:04:36,180 --> 00:04:42,260
So this is going to be a middle word as we pass and effectively we're looking for a response in the

59
00:04:42,260 --> 00:04:45,850
docs and then we're looking for this JSON option.

60
00:04:46,190 --> 00:04:55,640
So whereas object as the JSON method and what happens, we send back the JSON response and this matter

61
00:04:55,650 --> 00:04:56,840
sends a response.

62
00:04:56,840 --> 00:05:05,140
We correct on the type that is a primer converted to a JSON string using Jason String of five letters.

63
00:05:05,150 --> 00:05:10,090
Parama can be any Gersen type, including object, array, string and love.

64
00:05:10,550 --> 00:05:11,830
So hopefully you get the gist.

65
00:05:12,110 --> 00:05:14,570
So the only thing we need to do is go back.

66
00:05:14,840 --> 00:05:22,040
And for example, I'll provide an array where there's going to be two objects and first one will be

67
00:05:22,050 --> 00:05:26,250
name John and the second one will be Susan.

68
00:05:26,510 --> 00:05:34,820
So another object and we'll say name is equal to Susan and we have our most basic API.

69
00:05:35,330 --> 00:05:41,030
So if I go back to my localhost 5000 and refresh, there it is.

70
00:05:41,390 --> 00:05:47,690
So now anywhere in the world, I can access this data and build something using this data.

71
00:05:48,050 --> 00:05:53,720
Now, there's a tiny caveat when I say anywhere in the world, there's still going to be at the moment

72
00:05:53,720 --> 00:05:58,310
a course error and I'll cover that once we actually cover middleware.

73
00:05:58,550 --> 00:06:01,120
So again, please, please, please, please be patient.

74
00:06:01,460 --> 00:06:02,510
We will get there.

75
00:06:02,930 --> 00:06:11,510
But hopefully you get the gist where this serves our data and now we can just access that data and build

76
00:06:11,900 --> 00:06:14,300
the front end up using this data.

77
00:06:14,630 --> 00:06:22,160
Now, this default setup is nice, but of course we can do something more meaningful where if you take

78
00:06:22,160 --> 00:06:26,210
a look at the folder, you'll notice this data just now.

79
00:06:26,210 --> 00:06:27,230
What is there to address?

80
00:06:27,440 --> 00:06:34,580
It is simply a file with some arrays and the first error is going to be product.

81
00:06:34,580 --> 00:06:41,690
And here, as you can see, I have objects and then each of these objects represents a single product.

82
00:06:42,110 --> 00:06:48,470
And all the way in the bottom, we're exporting both arrays or exporting products as well as the people

83
00:06:48,980 --> 00:06:50,960
that we're going to cover a bit later.

84
00:06:51,230 --> 00:06:59,870
So now what I would want to do is import products already in my abcess and then instead of hard coding

85
00:06:59,870 --> 00:07:07,340
this value like so when I just pass in the array with two objects, I'll just dump the whole product

86
00:07:07,430 --> 00:07:07,740
data.

87
00:07:08,120 --> 00:07:09,500
So let's go with CONSED.

88
00:07:09,500 --> 00:07:10,870
We already know how to do that.

89
00:07:11,150 --> 00:07:17,930
Now, since I'm exporting multiple things, since I'm exporting an object, I will be explicit of what

90
00:07:17,930 --> 00:07:18,410
I would want.

91
00:07:18,420 --> 00:07:23,180
So I'm going to go with product and basically I'm the structuring right away.

92
00:07:23,180 --> 00:07:26,630
I'm going to say product is equal to require.

93
00:07:26,870 --> 00:07:34,300
And remember, the file is data just like so am and instead of passing all right.

94
00:07:34,310 --> 00:07:37,460
Directly can simply go with product.

95
00:07:37,790 --> 00:07:45,530
And what are you know, when you navigate to the road where it is now, we have more meaningful JSON

96
00:07:45,530 --> 00:07:49,410
response or actually this is a product.

97
00:07:50,030 --> 00:07:57,390
So on my front end, I can grab it and I can build some kind of nice fronton using this data.

98
00:07:57,680 --> 00:08:00,230
Now, lastly, before we go, let me just showcase that.

99
00:08:00,980 --> 00:08:06,850
There's going to be a content type set up correctly as well, so if you go to network type and again,

100
00:08:06,860 --> 00:08:11,230
if you're a fresh local host like show and take a look.

101
00:08:11,510 --> 00:08:13,940
Now, of course, what is the content type?

102
00:08:14,330 --> 00:08:16,640
That is application, Jason.

103
00:08:17,090 --> 00:08:20,600
And of course, we are correctly getting our Jason there.

104
00:08:21,050 --> 00:08:26,030
So hopefully you have a clear understanding how to send Jason there.

105
00:08:26,480 --> 00:08:31,910
And, of course, let's make things a bit more interesting and cover some more advanced express topics.

