State-Based Client-Side Routing

Instead of a routing library matching URL paths to components, this project stores the current page as a state value, and a router component reads that value to decide what to render. StoreContext holds page, an object like { name: "product", id: 3 }, updated through a goTo function whenever navigation happens.

PageRouter runs a switch statement on page.name, returning whichever page component matches, like HomePage or CartPage, and passes along extra params when needed, for example, rendering ProductDetailsPage id={page.id} so the details page knows which product to show.

For the admin panel, since it needed to sit behind an actual /admin URL, App checks window.location.pathname when it loads to decide whether to render the customer side or AdminApp.

Navigating to admin calls window.history.pushState to update the URL without a full page reload, and a popstate event listener keeps this state in sync if the browser back or forward button is used.