4 Routing
This chapter covers
- Traditional routing vs client-side routing
- Defining page components
- Triggering navigation programmatically
- Passing data via the URL
- Working with query strings
Routing, or navigation, is a fundamental concept when building web applications. Traditionally, moving from one page to another was a case of loading an entirely new, physical HTML page, from the server. In more modern server-based frameworks such as MVC or Razor Pages, those pages are dynamically compiled on the server before being sent to the client, but the process is still the same. However, in single page applications, things work a little differently.
As always, to help us learn about the concepts we’re going to uncover in this chapter, we’ll be building a new feature into Blazing Trails. Figure 4.1 shows how the feature will look once we’re done.
Figure 4.1 The new search feature we’ll be building in this chapter
This time round, we’re going to be adding a search function to the app. This is going to allow the user to search for a trail by name or location. We’ll use routing to navigate from the home page to the search page programmatically, passing the search term via the URL. Once on the search page we’ll extract it and then find any trails that match the term.