Routing Challenge

We've covered a lot of material so far, and 0:00 you're ready to declare more routes on your own. 0:02 The directory still needs to display the list of 0:04 courses inside the courses component. 0:07 So now I'd like you to create the routes for the HTML, CSS and 0:09 JavaScript course list components. 0:13 Let's go over what you'll need to do. 0:15 In this challenge, you are going to be working in the file Courses.js, 0:17 and the HTML, CSS, and JavaScript components you are going to render 0:21 are located here inside the Courses directory. 0:25 In the app, when you click over to Courses, you should be able to 0:28 click on a subnavigation link and see a list of courses for that topic, like this. 0:33 Now as you navigate between the different course routes, the course's heading and 0:38 sub navigation should always display above the HTML, CSS, and 0:43 JavaScript course lists. 0:48 So you'll need to nest the routes inside 0:50 the courses component like you did earlier in the app component. 0:52 And the sub navigation should also display an active link 0:56 when the user clicks to view a topic. 1:00 I've already included the CSS for the active links, 1:03 and I've included the URL paths for each link here in courses.js. 1:07 So this is a great way to practice what you've learned so far about routing. 1:11 In the next video, I'll show you how I did it. 1:15 Good luck and have fun. 1:17