Were you trying to deploy a live React App on Netlify and you ran into a “Page not found” error while navigating to inner pages in your routes.
The error often looks like this;
Why do we see this error?
React Router handles routing on the client-side (browser) so when you visit a non-root page (e.g. https://yoursite.netlify.com/else
), Netlify (server-side) does not know how to handle the route, because your roots are set up on the root level.
How to fix this issue:
From your editor, you can add a special “_redirect” file to your root directory with the following content;
Netlify’s documentation has a section, History Pushstate and Single Page Apps, which shows you how to redirect to the root of your SPA URL (but doesn’t mention React Router, as it applies to other client-side frameworks/libraries).
This file, when added to your codebase lets Netlify handle URLs that are not handled on the client-side.
For more ways & restrictions for redirect, check out the official Netlify documentation.
See more guides here…
Pingback: Software development for beginners - Getting Started