react-router-configuration

React Router configuration with multiple layout wrappers groups routes by PublicLayout and PrivateLayout, nesting child routes within each layout to separate concerns and enable scalable route definitions for multi-layout applications.

Setting a basename for React Router in a subdirectory deployment uses createBrowserRouter with a basename property, ensuring the router correctly resolves paths when the application is served from a subdirectory in production environments.

Adding authentication guards to nested routes in a React Router layout involves wrapping PrivateLayout child routes with guard logic, preventing unauthorized access while maintaining clear route hierarchy and centralized configuration.

Dynamic route parameters are supported with nested children in createBrowserRouter, allowing you to define parameter patterns within child routes while maintaining a centralized and scalable routing configuration structure.

This React Router configuration supports separating public and private route trees by assigning distinct layout wrappers to each group, enabling clean separation of concerns and centralized management of nested child routes.