Search code examples
javascriptreactjswebfrontendnetlify

Cant access react website with manual route links

I was using netlify to deploy my app and I noticed that we cant access website using manual routes, and results in displaying 404 :

https://edurekaclone.netlify.app => WORKS

https://edurekaclone.netlify.app/courses/5b21ca3eet4r6fbccd471815 =>Does not works

Even simple routes when visited manually like /login, are not working

We have to First visit homepage and navigate to other routes/pages from there only.

I am using react-router-dom and its purely frontend without any server

Solution

  • I found the fix, in documentation as mentioned by @jonsharpe, Thanks

    Basically you need a rewrite rule here which should be present in build/ folder, and would enable to access clean URLs

    ->>

    1. Add _redirects file in public/ folder

    2. Inside _redirects add /* /index.html 200

    ->>

    and Voila!

    This will also be reflected in the build deploy summary and logs

    -->Reference