Now that we have a good idea on the features we're gonna build out, let's actually get into the code.
With our PortfolioManager component in place, in this guide, we're gonna build out the two-column grid that we can see right here in the prototype application.
In this guide, we're gonna walk through how we can pull in our portfolio items and then we will eventually add them into the sidebar.
Now that we have all of our data residing inside of our portfolio managers state, what we need to do is create a component.
Now that we're pulling in all the relevant data let's wrap this up and add some styling.
In order to build out our portfolio manager form, we're gonna have to perform a number of steps.
In this guide, we're gonna start building out our portfolio form component, and we're gonna take a very staged approach to it.
With our form in place now we can start building out the handlers that are gonna connect the form in each one of those input elements into state.
In this guide we're gonna talk about a very cool feature in JavaScript. This is not specific to React, this is available in all of JavaScript and it is called the FormData Object.
Before we continue on in the course and building out our portfolio item form, I wanna take a step back and I wanna take care of these warnings.
Okay, I think we are ready to start building out our form so that it actually can connect to the API, and create records in the database.
Now that we know that we can create portfolio items using the API, let's now move into updating the form so that each one of these fields matches what the end-goal is.
This might be the shortest guide of the entire course, and there are a couple reasons why I'm actually dedicating an entire guide to the textarea.
Our application has a small bug in it. That bug is that even though our form begins with a default value for the category, when we hit save, no category is getting pushed up.
Now that we have each one of our data fields in our PortfolioForm configured and working properly, I think it's now time for us to connect the PortfolioForm with the Portfolio Manager so that when we create a new record, it will go and it'll actually update on the screen.
Our portfolio manager is coming along nicely and hopefully you're learning quite a bit about every stage of the React development lifecycle.
Now that we have Dropzone installed on our system, we can start integrating it into the portfolio form component.
This is gonna be a really fun guide because in this lesson we're gonna walk through and actually finish the image upload component.
Welcome back and we are going to now start populating the behavior that we've implemented already with our image uploader to the other two types of images.
devCamp does not support ancient browsers.
Install a modern version for best experience.