Hey, did everyone that they share?
And in this video, we're going to handle the images and it shouldn't be a scary stuff now, at least
after exploring the dark section about the images.
So what we're going to do is first I'm going to do a little bit of the cleanup.
I'm going to go into the users will browse.
I definitely need to delete all of that.
So I'm going to go ahead and just trash all of this.
Definitely not something that you should be doing into the production account.
This is just a test account.
So I'll go into the dashboard and obviously by the previous past experience, I know that it will require
my cloud name, API key and the secret as well.
So this is something that needs to go into my E and V file.
So let's go up here.
We can actually close all of them.
Yeah, probably all of them.
We don't need any of that.
So let's go up here first into Dot and V and let's go ahead and add a simple cloud.
Ordinary underscore this requires a cloud native name.
And again, I can actually make a copy of this.
So cloud e API key and we also need the cloud native API secret.
Again, this is a really super secretive information and once I'm done with the video, I'll definitely
change my API key and the secret.
Okay, so this is my cloud name.
Copy that.
And this goes up here again.
Nothing goes inside the double codes.
Everything goes just outside like that.
This is copy that and make sure you don't copy mine and just go ahead and create your own account.
It's not going to be working for you.
So copied to clipboard API secret and this goes up here.
Okay, so now I have done this one.
Now the point is, where should I inject this cloud native?
Now this is a great debate that we can have all together.
Now notice yet inside, whenever I'm writing the controller, I'm using majorly up here.
So what you can do is whenever these controllers load up, you can actually do their no harm deal,
no big deal, no harm.
You can go ahead and do that.
But from the great place of doing that is as soon as your application starts because notice we are using
cloud in the controller, but cloud only needs its config and all these variables to make these connections.
So as soon as the database is connected, just after that is always a good thing to have the cloud netting.
We have already got the cloud native installed, so let's go ahead and do all of that up here.
So we're going to go ahead and say, Hey, I want to use Cloud Neri and that is going to be coming up
from require and we need the cloud native here.
That's it.
All the cloud native information is up here.
Now let's go ahead.
And once the database is connected there, I'll just go ahead and say I want to have cloud in the re
config.
Kind of a goes here.
Okay.
So how do we actually go ahead and use the cloud config?
Again, you can look into the documentation we have just gone through in the last section only.
So it should be it should be in your head almost and at least not I just go ahead and say cloud config.
You might be saying, oh, I remember it.
Now all you got to do is provide all three values.
Just we go ahead and work on with that.
So let's go ahead and say, hey, first you go ahead and provide me a cloud underscore name and this
name is going to come up from process dot, e and V dot again.
Why does it suggest?
It doesn't suggest me anything.
Okay, where is my dot e and V?
And this is not cloud name.
So this is the cloud native name.
The second one is API key API underscore key.
It should be suggesting me that also, but it's not.
So I'm going to go ahead and say process dot E and V dot and let's bring it up here, cloud native API
key.
And here in the end you can name it anything.
But in this case this needs to be exactly called as API key, just as mentioned into the configuration
in case they change their documentation, then you have to update that one.
Usually they don't update that much of the things.
So we're going to go ahead and say secret and this will come up from process dot, e and V dot.
What did we call this one exactly?
That I always prefer to copy because in case I might have made a typo, that typo needs to go everywhere.
So that is the case.
Okay.
Once this is all done, now we can actually go ahead and close this.
So hopefully cloud native configuration, if that is correct, should be going everywhere around now.
I can go into the user controller itself and now I can worry about how to handle the images part.
The images are optional here.
Maybe somebody is creating an account and passing us the image or not.
So that all depends on that.
So for that we will be needing image upload as well.
So let's go ahead and first bring in the file uploader.
So far, the file uploader.
I'll go at the top and I will say that, Hey, you can come up here.
So let's just go ahead and say file upload and that will be coming up from require and express file
upload.
So file uploader is here.
I will worry about the image at the very top and I'll make a kind of a conditional statement that whether
these images are there or not.
So I'll check that first so I can come here and I'll just put a simple if statement.
Now, first thing is, if somebody is sending me the files or not, I need to take care of that.
So I'm going to go ahead and say if the request actually contains any files or not.
If they contains the file, then only I'll try to do that.
If there are no file being sent, that means things should go and work on as it is how they have been
working on in there.
Okay, so once the files are there, then I need to extract that file.
So let's go ahead and say I'll store this file into available and I'm going to go ahead and say, hey,
I want to go ahead and say, hey, request dot files dot and let's call this one as simply photo.
And again, this reminds me we forgot to do one thing that either if we are going with this way, then
somebody needs to send me file URL.
But this reminds me just in a minute that I can go into the index or JS and configure this a little
bit more.
I can just say that, hey, whenever somebody is using this app dot use, we can actually make this
file upload which except except the temporary files.
And for that I need to go not in the index actually into the app.
So let's bring up the file upload again.
We are already having the file upload probably.
We just wrote that at the top.
So let's go ahead and have it here just after the cookie parser and the file upload is there.
So now I can go ahead and say, hey, let's use the file upload and let me give you an object and I
will say that use temp files.
Yes, of course you need to do that.
Let's go ahead and say true.
And then we are going to say, what is your temp file directory?
We're going to go you and give you a directory which is say slash temp.
You can name this directory whatever you like.
Okay.
So this part is really important.
We have already discussed onto that.
Coming back onto the part now, we're going to go ahead and say that, hey, this file is coming in.
If that file comes up, just go ahead and extract this from files photo.
And this information needs to be conveyed to the front end user that, hey, you need to go ahead and
just call this one as photo, otherwise this will not work.
Okay.
So assuming that now you have a photo URL and we have an we kind of a burden out the front end users
role, let's go ahead and upload that.
So how do we do uploading of that part?
We actually need a cloud net here as well, so why not?
Let's go ahead and inject cloud native here as well.
So we are going to say, hey, give me a cloud DX Mary and that cloud native will be coming up from
require and coming from cloud.
So why do I need a cloud native here?
Because obviously cloud native is going to be responsible for uploading this thing.
So let's go ahead and say, hey, cloud ordinary, come on.
So just me.
There we go.
And we'll be using a dot v two of the cloud native since we didn't call it as V to appear.
We need to do this here.
So no big deal.
We're going to say dot v two and we are going to say, hey, you have a method uploader which can help
me to upload a file.
So for the uploading of the file, we can actually go ahead and pass on this file directly and that's
it.
Now also it takes some of the options, so let's go ahead and give these options.
We will be providing a folder because we have just cleaned this folder for the exact same purpose.
So we're going to go ahead and say, hey, just upload everything into the user.
Now, not only that, I want to restrict the user that what kind of the length and the width of the
photo should be.
So I'll restrict it onto the width part.
So I'll just say, Hey, whenever you're uploading the photo, just go ahead and make the width of 150.
Always, all the time.
I will also give it a crop because not all the photos are going to be there.
So we're going to go ahead and use the scale factor you want to use fit, scale, stretch, whatever
you like to do, you can just go ahead and do that.
Now, obviously, once this is being uploaded, we need to hold the results.
So we're going to go ahead and say let's go ahead and store you into the result.
Now, since this method is going to take some time, let's go ahead and use the weight here as well.
Okay.
So this is all good.
Now we have this result up here.
We need to access this result and further down the road we're going to inject this result as soon as
we create this object here.
So this result can be a little bit tricky to access from the top.
So let's go ahead and actually store that so let result.
And we're going to just do it like that.
Remove the coins from here so that we store the result directly up here.
Okay, so should be all good.
Now we have a direct access to this result without worrying about how deep in the level we are going.
Maybe you want to go further deep for some issues.
So once this is done, we know that this result holds the ID as well as the security URL.
So let me quickly verify into the model itself that we are calling it as photo.
We have ID and the security URL looks nice.
So further down the road I will say that, hey, we are going to create a photo option as well.
Now this photo option will be constructed based on since this is an object.
So let's go ahead and do this.
And we're calling this one as ID ID will be coming from result dot public ID underscore ID and it has
also secured URL.
Seek your underscore URL and that is coming up from come on secure URL.
And this is coming up from result.
Dot.
Come on, suggest me security.
There we go.
Okay, so now these things are done, and hopefully we will be able to handle the images nicely.
But we don't have any ways to test it through the postman, so we're going to just keep it as it is.
And I guess that's pretty much it.
Let's go ahead and see if we are able to actually register another user via the postman.
So I'm going to go ahead and select the two here.
And this one is going to be an email with the two at AE dot dev.
Let's see if we are able to send another user.
And notice here it says cannot read property public underscore ID of undefined.
So in this case we are we are not sending the image, but we are always crafting this one up here.
So this is the exact time when we make our model a little bit changes and move it on to the back model.
So again, remember, we always want to go ahead and grab these IDs.
So we're going to go ahead and say, hey, this is required and this is also required.
We don't know how to test it right now, but definitely this is what we want.
All the user who sign up should give us the photo and all of that.
So let's go ahead and save this one.
And the error should be different this time.
So let's go ahead and send this one.
And this one is saying again, cannot read the property of this public and all of that.
So this is the important part for us that, hey, we are requiring these models and all of that.
Let's go into the controller.
Now, remember into this photo, we are not able to read this result when we are not sending the photos
itself.
So at this point we are in a weird situation.
We are actually to over according the old model, the photos are compulsory.
Whenever a user is signing up, we want the photos to come up.
But at this point we cannot test these things from the post one itself.
So we need to figure out a solution.
Of course we will.
We always do.
It might take some time, but we always figure out a solution.
So let's go ahead and catch up in the next video and we are going to see a small kind of out of the
box solution of how to test out in these weird situation.
Let's go ahead and catch up into the next video.