Routing Best Practices

Hey all, currently my app navigation is controlled by state, as a SPA. This leads to confusion when my users hit the browser back button, and I’d like to switch to a proper navigation structure.
What are best practices here? Would love a routing structure such as app.example.com/campaigns/1234x5678

I used to use states for this kind of thing, but I’ve since started using URL parameters for the exact reason you stated: Going back in the browser wipes out the states. So, instead of setting a page’s “tab” state (or whatever) to “tab 1”, I now opt to navigate to a URL with “tab” as a parameter. So app.example.com/campaigns/1234x5678?tab=tab1, for example.

Then just grab the tab parameter from URL rather than use the state-dependent logic. Hope that helps.

2 Likes

Like @nnich19, I go with url parameters having tried the custom state approach. In addition to what he stated, you get a couple other benefits:

  1. It is easier to send direct URL’s to people (works great with a URL shortner)
  2. URL parameters traverse across reusable elements, unlike custom states. In other words, if you have nested reusable elements, passing custom states can be a pita.
2 Likes

Thanks all, looks like a mix of routing and params is the ticket.