1
00:00:01,170 --> 00:00:08,150
In this video, we are going to allow a user to upload image when creating a post.

2
00:00:08,160 --> 00:00:12,560
So let's get back to the controllers and then post and post.

3
00:00:12,780 --> 00:00:21,740
JS So to be able to accept file upload, unless we pass Mora with a combination of the cloud binary

4
00:00:21,750 --> 00:00:22,800
to get it done.

5
00:00:22,800 --> 00:00:25,380
So let's get back to the post route.

6
00:00:25,380 --> 00:00:30,060
So here we go, root and post root, which is this.

7
00:00:30,210 --> 00:00:34,950
So first step is that we need to require the more top package.

8
00:00:40,610 --> 00:00:44,830
And then we need to require the storage from cloud.

9
00:00:45,200 --> 00:00:47,770
So let's get back to the config cloud.

10
00:00:48,410 --> 00:00:54,530
Let's save it and let's get back to post roots and let's require the storage.

11
00:00:54,860 --> 00:00:56,150
And here we go.

12
00:00:56,540 --> 00:01:01,010
The next step is that we need to create instance of motor.

13
00:01:01,010 --> 00:01:07,160
So going to be as instance of motor.

14
00:01:07,340 --> 00:01:09,680
And it goes like this const.

15
00:01:11,320 --> 00:01:18,220
Upload is equal to more to package and you pass in the storage.

16
00:01:18,880 --> 00:01:19,660
All right.

17
00:01:19,660 --> 00:01:25,240
So we are going to pass this one as a third argument to this great controller.

18
00:01:25,240 --> 00:01:27,760
So I'm going to be asked upload.

19
00:01:27,760 --> 00:01:34,720
And for this we are accepting a single upload, going to be single and pass in the field name for this

20
00:01:34,720 --> 00:01:36,100
I'm going to use file.

21
00:01:36,100 --> 00:01:42,700
You can use any field name, but make sure that you pass in the field when we are creating the post.

22
00:01:43,390 --> 00:01:48,040
So in next is let's get back to the controller and let's add the image.

23
00:01:48,040 --> 00:01:54,310
Remember when you make the request is going to save the image into cloud array and cloud survey, we

24
00:01:54,640 --> 00:01:59,860
send us back the image being saved on the red .5. path.

25
00:01:59,860 --> 00:02:08,020
So here we are going to add the property code image here and it can be found on the red dot file dot

26
00:02:08,020 --> 00:02:08,590
path.

27
00:02:09,220 --> 00:02:16,420
So for this this how is going to work first is is going to check if a user is logged in and indeed the

28
00:02:16,420 --> 00:02:22,300
user is logged in, then it will make a request to cloud to save the image.

29
00:02:22,540 --> 00:02:27,730
Then after saving the image to cloud Neri, then it will get back to the grid post.

30
00:02:27,790 --> 00:02:34,570
So by the time this one runs we have the file already on the red dot file dot path.

31
00:02:34,990 --> 00:02:37,330
So let's go ahead and make the request.

32
00:02:37,330 --> 00:02:39,340
And this is a request handler.

33
00:02:39,370 --> 00:02:41,590
Let me reduce the font size.

34
00:02:41,590 --> 00:02:49,360
So here, how are you going to create an image with a combination with Jason Data it going to be different.

35
00:02:49,360 --> 00:02:56,260
So instead of passing in, JSON is no more using data, but instead is going to be a form data.

36
00:02:56,260 --> 00:03:03,700
So we are going to remove this one from here and let's click on form and click on files.

37
00:03:03,700 --> 00:03:06,130
Here we have two fields.

38
00:03:06,130 --> 00:03:08,920
One is a form field and then the files.

39
00:03:08,920 --> 00:03:15,220
The fields contains the properties of the post that we want to create, and the first one is a title

40
00:03:15,220 --> 00:03:21,280
of the post and our code is one as a HTML and then the description.

41
00:03:22,190 --> 00:03:24,050
Then the category.

42
00:03:24,750 --> 00:03:27,690
And I will use JavaScript.

43
00:03:30,680 --> 00:03:37,670
And for 5 hours I'm going to pass in the food name, the one we use inside the mortar file.

44
00:03:37,910 --> 00:03:41,710
So let's select the image that we want to upload.

45
00:03:41,720 --> 00:03:44,090
So I'm going to upload this image.

46
00:03:45,050 --> 00:03:46,340
And it sent.

47
00:03:47,500 --> 00:03:50,210
Well, we got an empty object.

48
00:03:50,230 --> 00:03:53,860
The problem is that we need to check this checkbox.

49
00:03:53,860 --> 00:03:56,690
Meaning that we are sending an image.

50
00:03:56,710 --> 00:03:59,050
So let's hit send again.

51
00:04:00,120 --> 00:04:07,260
And you can see that it has been created successfully with the image being added in the user and all

52
00:04:07,260 --> 00:04:09,060
the fields that we added.

53
00:04:09,450 --> 00:04:10,290
All right.

54
00:04:10,290 --> 00:04:14,430
So that is how we can create a pose with an image.

55
00:04:14,820 --> 00:04:22,560
Let's go ahead and send an If a user refused to provide an image or title or description upon creating

56
00:04:22,560 --> 00:04:23,310
a post.

57
00:04:23,340 --> 00:04:30,570
So it's going to be inside the try and going to be as if there is no title.

58
00:04:33,770 --> 00:04:36,380
Or there is no description.

59
00:04:37,890 --> 00:04:46,200
Or there is no category or there is no file on the record file.

60
00:04:46,320 --> 00:04:49,310
Then you go ahead and then through an error.

61
00:04:49,320 --> 00:04:57,410
So let's pass it next to and let's bring in our app error handler inside the Utils App error.

62
00:04:57,420 --> 00:05:02,790
We save it and let's get back to the controller and let's require the app error.

63
00:05:11,260 --> 00:05:19,600
So inside the F block, we are going to retain context and pass in the app era and the message will

64
00:05:19,600 --> 00:05:25,000
be all fails required.

65
00:05:28,170 --> 00:05:28,680
All right.

66
00:05:28,680 --> 00:05:34,610
So let's go ahead and make a request without providing weather, image or title.

67
00:05:34,620 --> 00:05:36,960
So let's uncheck this and let's hit send.

68
00:05:37,860 --> 00:05:40,260
And you can see we have the message.

69
00:05:40,260 --> 00:05:41,700
That's the error message.

70
00:05:41,850 --> 00:05:46,490
If I don't check the title, we have the same message.

71
00:05:46,500 --> 00:05:50,670
So that is how we can create a post with an image.

72
00:05:50,820 --> 00:05:57,390
So let's get back to the user's end point or the user profile and let's see how many posts a user has

73
00:05:57,390 --> 00:05:58,100
created.

74
00:05:58,110 --> 00:06:05,370
So let me collapse all the opening tops and let's click on ten clients and let's get to the users and

75
00:06:05,370 --> 00:06:09,840
profile, which is this When I hit send, let's have a look.

76
00:06:10,140 --> 00:06:18,660
And you can see that this user has created three posts, but instead of the actual post, we are having

77
00:06:18,660 --> 00:06:21,830
the ID and that is what we specified.

78
00:06:21,840 --> 00:06:28,710
So if you want to get the real post on, let's use what is called populate on that.

79
00:06:28,710 --> 00:06:31,410
So let's get back into that in the next video.