WEBVTT

1
00:00.500 --> 00:01.790
Hi everyone.

2
00:01.790 --> 00:07.640
In this video let me show you how we can do the swagger UI.

3
00:07.670 --> 00:08.210
Okay?

4
00:08.210 --> 00:15.380
Right here inside the post and create a post, we have something called example value okay.

5
00:15.380 --> 00:19.910
Right now we don't have any idea about what's inside the value right here.

6
00:20.090 --> 00:28.310
And for that reason I will show you how we can do that over the open APIs and click on Type and Parameters

7
00:29.120 --> 00:31.640
okay and reading the topic right here.

8
00:32.000 --> 00:39.770
Now you can see inside the DTO we will add something called @ApiProperty okay.

9
00:42.710 --> 00:44.750
So let use that.

10
00:47.000 --> 00:50.840
I will copy the @ApiProperty here and go back.

11
00:51.500 --> 00:56.420
And I will go to DTO.

12
00:57.560 --> 01:03.410
And import that and use the @ApiProperty right here.

13
01:07.580 --> 01:15.680
So now if I refresh, let's see and let wait a bit to restart the server.

14
01:15.710 --> 01:22.490
Now you can see. In the post, we already have something called title and description with a string.

15
01:22.520 --> 01:23.090
Right.

16
01:23.120 --> 01:27.080
Now I will show you how we can customize the string right here.

17
01:27.290 --> 01:32.840
We can scroll down and we can provide a description right here.

18
01:33.500 --> 01:34.100
Okay.

19
01:35.030 --> 01:36.920
And the default

20
01:37.850 --> 01:42.920
Let me try to copy everything and open the API property.

21
01:43.130 --> 01:43.670
paste it

22
01:44.330 --> 01:47.660
And we will use description.

23
01:47.660 --> 01:50.360
The title of description.

24
01:51.530 --> 01:52.640
Uh, sorry.

25
01:52.640 --> 01:58.340
The title of post, okay

26
01:58.370 --> 01:59.720
Minimum and default.

27
02:00.200 --> 02:06.000
And let me refresh to see, right here you can see.

28
02:06.030 --> 02:07.620
The title will be one, right?

29
02:07.650 --> 02:11.190
So for that reason easily found here, we can change that.

30
02:11.580 --> 02:12.510
We can change.

31
02:12.510 --> 02:16.470
So for example: "title 1"

32
02:16.500 --> 02:17.700
If I refresh again.

33
02:21.510 --> 02:25.740
And let wait a bit to server restart.

34
02:27.570 --> 02:29.670
And you can see it has something like this.

35
02:29.700 --> 02:35.730
If I click on check out and you can see like we can customize this and send a request.

36
02:35.760 --> 02:36.270
Right.

37
02:37.860 --> 02:41.790
Let me custom. I think I don't need the minimum.

38
02:44.550 --> 02:53.010
In here copy and replace with description right here I will name the description post.

39
02:53.160 --> 02:57.480
Or actually if you don't want you can try to remove this okay.

40
02:58.290 --> 03:02.250
Maybe if you lazy, you can remove that.

41
03:02.250 --> 03:06.120
And right here I will description one for example.

42
03:10.080 --> 03:11.400
Let me refresh again.

43
03:11.430 --> 03:15.360
Now you can see it already changed right now.

44
03:15.540 --> 03:21.750
And I want notice about some notes for you.

45
03:22.680 --> 03:27.990
Now when you create a DTO when you create a new DTO.

46
03:28.020 --> 03:33.960
Make sure we add the @ApiProperty in the beginning okay.

47
03:34.410 --> 03:37.530
Don't try to create 100 DTOS.

48
03:40.470 --> 03:46.290
And afterwards go back and add it one by one okay.

49
03:46.590 --> 03:49.830
It's a little bit silly right?

50
03:50.820 --> 04:00.810
So for that reason, if you want use the swagger at the beginning of the project, you must put it right

51
04:00.840 --> 04:01.860
at the beginning.

52
04:02.370 --> 04:02.970
Okay.

53
04:03.030 --> 04:11.830
But I think in the next project I will not use swagger because I.

54
04:12.040 --> 04:19.990
I like using the postman rather than the swagger

55
04:20.110 --> 04:26.320
Okay, so but anyway, you can try to do that.

56
04:31.390 --> 04:37.360
And the one more reason in the next video I will not show, because it will take a little bit of time

57
04:37.360 --> 04:46.510
for me to add something like @ApiProperty and something like API description and default.

58
04:46.540 --> 04:46.840
Right.

59
04:46.870 --> 04:52.090
So for that reason, I will not do that in the next video in the next project.

60
04:53.080 --> 04:56.380
But if you want, you can feel free to do that.

61
04:58.000 --> 05:02.710
And let me show you one more thing will be the the tag.

62
05:03.070 --> 05:03.430
Okay.

63
05:03.430 --> 05:04.120
When.

64
05:04.120 --> 05:06.940
We use the

65
05:08.080 --> 05:14.800
When we use the swagger UI, it will auto generate for you the the tags.

66
05:15.040 --> 05:15.340
Okay.

67
05:15.340 --> 05:16.870
This here will be called the tags.

68
05:17.950 --> 05:22.990
Now, for example, if you want to rename the tags you can feel free to do that.

69
05:23.740 --> 05:26.020
Click on operations right here.

70
05:26.140 --> 05:30.790
And now you can see it will mark the controller with the @ApiTags right here.

71
05:31.150 --> 05:34.210
Let me try to copy that and I will open the post.

72
05:36.400 --> 05:37.630
Open the post right here.

73
05:39.970 --> 05:41.650
I will close everything.

74
05:42.430 --> 05:45.040
And inside the post I will create a post.

75
05:46.120 --> 05:51.730
I will go to the post controller and paste it directly right here.

76
05:53.500 --> 05:54.130
Okay.

77
05:54.190 --> 06:03.700
If I use the "cats" right here, let's see what happens if I refresh now you can see it rename for me,

78
06:03.730 --> 06:04.210
right.

79
06:04.840 --> 06:08.830
Renamed from the posts to the "cats".

80
06:09.580 --> 06:11.200
Right here.

81
06:11.230 --> 06:11.530
I pass

82
06:11.530 --> 06:15.430
The boss for example like this

83
06:17.290 --> 06:19.420
Now it will have a posts, right?

84
06:20.020 --> 06:21.520
And let me change the name to.

85
06:21.700 --> 06:24.340
From the user to users.

86
06:26.110 --> 06:27.040
Right here.

87
06:33.730 --> 06:35.170
The default

88
06:35.470 --> 06:36.130
default

89
06:36.130 --> 06:38.260
It will use the entity I think.

90
06:40.600 --> 06:43.120
But let me rename it to the users.

91
06:46.270 --> 06:46.960
Refresh

92
06:49.300 --> 06:49.690
Okay.

93
06:49.690 --> 06:50.800
It already renamed.

94
06:51.850 --> 06:52.870
And that is.

95
06:57.430 --> 07:00.790
So now let me try to open the @Put right here.

96
07:01.300 --> 07:04.480
And sorry here I will @Get

97
07:04.480 --> 07:06.980
It will have some {id} like that, right

98
07:08.000 --> 07:16.730
You can try to do that if I try to create, for example, with this here I will excute.

99
07:17.870 --> 07:24.710
And now you can see, we already have status code and some ID right here and description.

100
07:24.740 --> 07:25.160
Right.

101
07:25.460 --> 07:26.390
Let me copy.

102
07:26.420 --> 07:37.040
And if I go back here I will click on try out and paste the ID and excute, it say not found

103
07:37.370 --> 07:37.640
Hmm

104
07:40.520 --> 07:42.500
Let me try to get all the posts.

105
07:46.520 --> 07:47.750
Let me copy here.

106
07:49.850 --> 07:54.140
Copy the URL and here excute.

107
07:57.350 --> 07:59.180
I don't know why it's not found

108
07:59.180 --> 08:02.420
Maybe I make some wrong

109
08:05.810 --> 08:10.460
But if I look at the real database, I think it must work.

110
08:12.020 --> 08:14.600
Okay, you can try to open a new database.

111
08:21.920 --> 08:24.470
And we also have a @Put. If I open the @Put

112
08:24.500 --> 08:29.660
You can see in the PUT we doesn't have any example value right.

113
08:29.690 --> 08:41.990
So the reason because if I open the DTO and open the UpdatePostPatchDTO, we have a PartialType

114
08:42.020 --> 08:42.590
Okay.

115
08:43.250 --> 08:47.870
The PartialType will not work in this case for that reason.

116
08:54.200 --> 08:57.410
Sorry, I think this here

117
08:59.480 --> 09:03.110
So if you open the Patch it work right.

118
09:03.140 --> 09:09.390
It work because in the PartialType, we already import it from swagger

119
09:09.960 --> 09:10.410
Okay.

120
09:11.010 --> 09:16.980
For that reason, with the PartialType from swagger, it will inherit form for you.

121
09:20.100 --> 09:22.080
And we also have the Delete one

122
09:22.170 --> 09:22.500
Okay.

123
09:22.530 --> 09:24.300
You can try a little bit with that.

124
09:25.140 --> 09:25.620
So?

125
09:28.080 --> 09:30.930
I think that's enough, right.

126
09:30.960 --> 09:35.460
You can customize something called header if you want.

127
09:37.770 --> 09:41.940
And for example API response if you want.

128
09:42.810 --> 09:45.360
Okay let's read the document.

129
09:45.390 --> 09:50.460
And with file upload, you can try to do that. The file upload using the @ApiConsume

130
09:50.490 --> 09:52.890
with the mutipart/form-data.

131
09:53.250 --> 09:54.810
And you do something like that.

132
09:57.000 --> 10:04.560
Now let's look at the documentation and see and apply them into real project if you want.

133
10:05.130 --> 10:07.590
Okay so I will see you in the next one.