Instructor: In this section, we're gonna start working
on the next big feature inside of our app,
which is image upload.
At present,
whenever we look at blog posts inside of our app,
you'll notice that they are nothing but text
and text is really boring.
So I think it would be a lot more interesting
if we allowed our users to somehow upload an image
along with their individual blog posts
and have those images then be displayed on the screen
whenever a user looks at an individual post.
So we need to first start off by thinking about
how we would integrate image upload into the client side
of our application.
If you recall, when you click on the red button down here
and then enter in a title and some content and click next.
You go to a review screen right here
where you have to confirm your entries.
I think it would be really nice if we added in
some file picker to this screen right here
and allowed a user to attach an image to this blog post
that they're about to make.
So then anytime they click on save blog right here,
it would automatically create the blog post
and also upload the image they select.
Then when they go and look at a individual blog
they should see that image appear on the screen.
So if we put this in diagram format,
those two screens would end up looking like this.
So over here on the left hand side,
we've got that review screen.
So we'll see some text there that says something like
Attach an image, and then underneath it,
they'll have a button that they can click
to pick an image off their hard drive.
And then anytime they go look at an individual post,
that image should appear underneath all the text.
This is going to require us to not only work a little bit
with the backend of our application
but we're also gonna have to write some code
inside the React side of our app as well.
Now if you're not familiar with React
or you don't have any experience with it,
that's completely fine.
All the code we're gonna write is
only gonna be a couple dozen lines or so.
So, it'll be rather straightforward
to integrate all this image stuff
into the client side of our app.
What's much more important is that you understand
the flow of upload
and how we're going to actually treat these images
on the backend.
So with that in mind, let's take a break.
We're gonna come back the next section
and we're gonna talk about the general strategy
of handling image uploads.
So I'll see you in just a minute.