4 Routing

 

This chapter covers

  • Distinguishing traditional routing from 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 you 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
CH04_F01_Sainty

This time around, we’ll 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.

4.1 Introducing client-side routing

4.1.1 Blazor’s router

4.1.2 Defining page components

4.2 Navigating between pages programmatically

4.3 Passing data between pages using route parameters

4.4 Handling multiple routes with a single component

4.5 Working with query strings

4.5.1 Setting query-string values

4.5.2 Retrieving query-string values using SupplyParameterFromQuery

Summary

sitemap