0

Context:

I have a react app with multiple pages along with react router, some pages use references of react router to read route params. Now I am trying to create a new app with next js, so that I could server side render all my pages.

For this, I am trying to use react-router with next js, so that I don't want to make changes in the shared pages(which uses react router references)

Example:

<BrowserRouter>
   <Switch>
       <Route path={'/'}><Home /></Route>
       <Route path={'/about'}><About /></Route
   <Switch>
</BrowserRouter>

Consider both Home and About are react components and are not present under 'pages' folder

Problem:

When I use react router, it just does the client side rendering, I don't see any calls in network that renders the prerendered html for new route

Please share your thoughts!.

Dinesh Kumar
  • 107
  • 1
  • 10
  • The entire purpose of using react router is to avoid making calls to the server. Use ordinary `` elements instead of `` elements to suppress this behavior. – mousetail Jul 07 '22 at 14:40
  • "When I use react router, it just does the client side rendering, I don't see any calls in network that renders the prerendered html for new route." - This is kind of the point of using client-side routing. No page requests are made to the server as they have all already been "fetched/requested" in the app bundle. – Drew Reese Jul 07 '22 at 16:34
  • 1
    @Drew ReeseOk, I have a react component in shared path and is used by other react app. Now I want to create another react app with seo and use those shared react components . Shared react components already access url Params using react router , so I wanted to use react router in the seo app as well . I use next js for ssr, with which react router is still making client side routing . What is the best way to achieve SSR in this case – Dinesh Kumar Jul 08 '22 at 06:26

0 Answers0