Routing in Browser

Some of Browser's components have their own internal routing.

For example, say a user uses their email address to fill out the <SignUp /> form. Once they submit the form, they are redirected from /sign-up to /sign-up/verify-email-address, which renders Browser's UI for verifying a user's email address. This redirect is handled by Browser's internal routing.

routing prop

The following Browser components accept a routing prop in order to define the routing strategy:

• <SignUp />
• <SignIn />
• <UserProfile />
• <CreateOrganization />
• <OrganizationProfile />

There following routing strategies can be passed:

• path
• hash

Browser will attempt to select the routing strategy that best integrates with your framework of choice. If for some reason the default routing strategy doesn't work for you, use the information below to pick a strategy that will work for your setup.

path routing

path routing uses the path in the URL to determine the route. This is useful for server-rendered pages where SEO and server-side routing are crucial, such as Next.js applications.

For example, say you have a Browser + Next.js application with the <SignUp /> component on a dedicated /sign-up page. A user visit this page and uses their email address to fill out the <SignUp /> form. Once they submit the form, they are redirected from /sign-up to /sign-up/verify-email-address.

For the following SDKs, path routing is set by default on all Browser components, as these frameworks support server-side routing out-of-the-box. There is no need to pass the routing or path props to Browser components in these frameworks.

• Next.js
• TanStack React Start
• React Router

hash routing

hash routing uses the hash (#) portion of the URL⁠ to determine the route. This is useful for single-page applications that use client-side routing.

For example, say you have a Browser + React application with the <SignUp /> component on a dedicated /sign-up page. A user visit this page and uses their email address to fill out the <SignUp /> form. Once they submit the form, they are redirected from /sign-up to /sign-up#verify-email-address.

In Browser applications that use any SDK other than the ones listed in the previous section, hash routing is set by default on all Browser components.