 All right, hello, everyone. This is React course assignment number two. I just want to make a clarification here because the template used for the assignment is no longer the same as before. So if you watched a video, if you follow along, you'll see that the demo or the theme that they use had a directory called vendor, and that's no longer the case because they updated their template. So again, if you go here, you know what this here will get a lot of free templates, and you are more than welcome to use any templates of your choice. The one I'm using for this course and for the videos throughout the course is from this link here. So if you click that, it's going to take you here. And all I'm going to use is basically the layout, the navigation, and the footer down here. And so when you download the free download link here, you're going to get a zip file. And what you're going to do is you unzip the file to your computer. So I unzip it to the desktop, as you can see here. OK. If you open it up, you notice that there's no vendor photo as you might see in the other video. So in the other template, there's a template video. And there's a vendor photo that has some assets in there. But now they changed it a little bit. So there's no vendor anymore, which is fine because they just could basically change a few things in the HTML. So here is what we're going to do. So we're going to go here. And so the React is running already. So we're going to go to the source code here. And so right in here in the public directory, you just could basically drop those files in here. So I'm going to go back and show you the file. You can see I just going to basically drag and drop this in here. But you want to be careful because you don't want to overwrite this HTML in here. So this index is the one that we are using in open here. It's just the React template. So you can move all these comments out and a little bit messy, but you don't really need all these comments. It just makes your code hard to read. So this is the index for the React. And I want to do is move all these in there. But I don't want to replace the HTML index. So you can replace it or rename it to something like index 2 or whatever, something else. Then all you have to do is drag all of these. And then I'm highlighting all of them and drag it into the public folder. So make sure that public folder is highlighted, as you can see in blue, and then let go. So you can see that the assets, CSS, and JS are included. Now these are part of the template that is needed for the index 2, which is this file here. So this one here, just make sure if you run it, like if you run from here, and let's see if this works. You're going to see the output. Yeah, as you can see, it looks just like the other one. It's coming from my local server. But you see that this is the one that we want. You want to grab just the navigation and the footer. And so just make sure you also include the CSS, and JavaScript, and the other stuff. So we're going to apply that to this React application. Back in here, the things that you need. And so basically, this is the one that we are using. I'm going to move over some stuff. So I need to move the CSS from this index 2. So basically copy these two links here, copy that, and go over here, and paste it right below the title. You know, just exactly where they have over here. So there's a title for this site, and the links are right below that. OK, so I need that. And this is navigation right here. From here to here is navigation. So again, just highlight all of these here, copy that, move it over over here to the React file. And you can put it right, for now to get you started, you can put it right above here, that's fine, put right here. OK, so it's above the div root here, and then the footer goes down here. So you go back here, we're going to skip all of these content. We don't need all these here. So go all the way to the bottom, and the footer area. So basically copy everything, the footer part, copy and paste it right in here, and then that's it. OK, everything is already in here. And the reason why you don't see the vendor anymore, because they use a CDN, where we have the bootstrap, everything is coming from the CDN as opposed to coming from the vendor folder. So that's the only difference. I think the rest are just scripts. And so these scripts are coming from the JS folder. This is from the CDN now as opposed to the vendor. So that's why they've been with the vendor. And then up here, again, CSS is coming from the CSS folder and so forth. That says it's just a logo. And right click, and then go and clean up the document. So a little bit nicer. OK, whatever. Come on. OK, there you go. Clean up and save that file. All right. And it can collapse this. You can see a little bit better. So here's the navigation on the top, the footer on the bottom, and the script I need to run on the bottom as well. And save that. Go open the file. And you will see that now it's integrated, OK? And now, of course, this is not part of the React component, but that's for you to complete in the assignment. So that's what you need to do for this part. All right, if you have any questions, please let me know.