So, this code here needs to be adjusted and again I'll use AI here.
If I were using cursor, chances would be high that it would automatically make the appropriate
suggestions and I would simply have to confirm them by hitting tab.
Here when I'm recording this, GitHub Copilot is not that smart and therefore I have to
tell it.
So here I will tell it, extract the image key and store it in the database.
Let's see what that gives us.
It extracts it here, stores it here, that's looking good, yeah, should do the trick.
Let's accept it and make the same changes here.
Also store image.
Shift the context from before, this hopefully should be enough.
Extracts the image key, stores it in the database.
Looks good.
Of course we need to make sure that we have an image field in the database though.
So in the database.js file, when we create the events table, we must make sure that there
is an image field and GitHub Copilot suggests this here due to my latest edits.
And of course therefore I edited the events table, hence I'll delete the database SQLite
file to reinitialize it and restart my development server.
And that should now ensure that this events table is set up appropriately and with all
the other changes made, we should be able to extract and store uploaded images.
So to test this image upload feature here, we can go back to Postman and since I deleted
and recreated the database, I'll start by signing up a new user again.
And I'll grab that token because I'll need it.
And I then want to send a new event here to the backend.
So a post request to slash events with my new token here added to it.
But now we need to change the body because now we must include an image here.
And I will actually generate an image here with help of chat.gpt.
Create a dummy event image showing a group of people hiking in the mountains.
You can use any image of course, you don't need to generate with AI.
But since this is an AI course, we can of course also do that, I guess.
So that will be a dummy image which I want to upload.
Yeah, they look a bit, well, not too happy, but I'll take it.
Upload this image.
And then here in Postman, we need to change the body type from JSON to form data.
And then there, we again can add title.
Now we just use this nice table here to enter that data.
Description, test event, address, test street 5, date, I'll grab this date here.
And then before clicking into the field, you should have a drop down here where you can
select file and give this a name of image now and then select that file.
So I did now select that image which I generated with AI.
If I now send this request, looks like the event was stored.
Now actually, I did not change the name of that file.
So I got a super long file name here, should have changed it before.
Actually gives me a good opportunity to test this put route and first grab that token again
and use that here in the header like this.
And then there also change the body to form data, enter all that information like a title,
tested event, description, updated, dot, dot, dot, address, updated and date is this
date here.
Again pick a file and I'll generate another file.
Give me another one.
Let's see if that works.
Here we go.
Yeah, sure.
Let's take this one and I'll rename it off screen and I'll grab it and also store it
under a key named image, send this and looks like it was updated.
And if I now go back to my code, to my project folder here, we should see that in the public
images folder, we got those image files.
And if I refresh here with refresh explorer, I can indeed see them here.
So they were indeed uploaded and stored in that public images folder.
So that image upload functionality is working the way it should work here.
Again, you can always tweak it, change parts of it, but the main functionality here is
working the way it should.