Check out a free preview of the full Advanced Vue.js Features from the Ground Up course:
The "Challenge 14: Route Table" Lesson is part of the full, Advanced Vue.js Features from the Ground Up course featured in this preview video. Here's what you'd learn in this lesson:

In this challenge, students implement a route table.

Get Unlimited Access Now

Transcript from the "Challenge 14: Route Table" Lesson

[00:00:00]
>> Evan You: This is pretty straightforward, but we notice that our configuration is essentially hard-coded. Ideally, you have an app and you have some routing configurations. You want this routing to be somehow hoisted out so that you can have a routing table you can look at. You know which path corresponds to what, which this example does not have.

[00:00:30] So our next exercise is essentially building it on top of that, I need to switch back.
>> Evan You: 5.2, now we have a bit more boilerplate written for you. We have a foo component, have a bar component, and we have a not found component, okay, and we have a route table.

[00:00:54] We want to implement the route table so that the rendering is the source of truth, how your path to correspond to components should be from this route table. And the behavior should remain the same from the last half except for when you are at a hash that is not foo or not bar it should display not found.

[00:01:23]
>> Evan You: And just as a hint it's probably a good idea to use render functions for this exercise.