Why use custom router in the project?

[winner106]

Thanks for sharing this wonderful project, I am a newcomer, I know that NextJS has file-system based router, so why use custom routing in start-ui-web project?

This question puzzled me for some time, can not understand, could you please give me some opinion? Thank you so much!

[yoannfleurydev]

Hi @winner106, I converted the issue as a discussion so it is better for us to manage the real issues.

We do not use the Next.js router because it does not allow nested routes layout like react-router-dom can offer (as explained in the README, we might improve this part in the future). At @BearStudio, we mostly use this project to generate back office applications that does not require the Next.js Routing and Server Side Rendering, so we made the choice to use react-router-dom for the app part that is provided by the app.js page that use the Next.js routing.

I hope everything is clear. Feel free to ask more questions if needed. 😊

[vmundhra]

@yoannfleurydev Does this change with the introduction of the app directory structure and layouts in Next.js 13+?

[ivan-dalmet]

Yes when the app router of next 13 will be stable we will migrate from React Router to the app router of Next 😊
(the 13.3 is pretty good and support export so we will start the migration soon I think)

[vmundhra]

@ivan-dalmet Thanks. Per Vercel, Next.js 13.4 is now stable (https://nextjs.org/blog/next-13-4). I see that you guys have moved to app directory in latest release, however still use react router for all app routes. Any plans for completely switching to Nextjs router? Btw lovely starter project. :)

[yoannfleurydev]

No plan on moving to complete Next.js app directory because it doesn't support (yet) client side routing. We did saw it coming, but Next.js doesn't support full static export with client side routing. Imagine a full static export (hosted on Apache HTTPD or Nginx for example) with a route /admin/users/{login}, Next.js won't know how to handle this dynamic client route.

For that purpose, we decided to keep React Router which handle client side routing perfectly, with lazy loading support. Most of our clients just need client side applications (for static hosting), and we find it easier to migrate from React Router to app directory, rather than implement React Router when needed.
Some documentation will be coming soon about those choices and how to easily migrate from React Router to app directory.

Hope this answers your questions. Happy to see that you are following the project with interest 😊