Search code examples
reactjshttp-redirectdeploymentroutesnetlify

netlify redirects not working in react app


I'm at a beggining of my programmer journey, this is my firt post, probably not last.
So here is problem. I build portfolio project in React, using create-react-app. It was not necessary technology but I wanted to practice, by moving simple site to React. I used routes for multipage (there is only 2 pages). I used custom domain, because this will be site for my mother hairdresser salon, and Netlify free hosting. Here is link:
https://bozena.net.pl/
I struggle with redirection for gallery (galeria).
https://bozena.net.pl/pages/Gallery
If I go directly there or refresh, its not working. I used API for pictures, if thats matter. I found out I need to use _redirects file in build folder, but I cant figure out exact syntax for this (I checked Netlify documentation about _redirects). For now my _redirects file looks like this:

/                   https://bozena.net.pl/#price-div 
/                   https://bozena.net.pl/#contact
/(whats here?)      https://bozena.net.pl/Gallery  

I tried different paths for this gallery, like /pages/Gallery (here is jsx file for gallery) but I didnt find anything working. price div and contact are divs on main page,and this directions will get me to main page. Anyone help me get this gallery link working?
Here is code for whole page:
https://github.com/kadynski/Hairdresser-app code bold italic

quote Draft saved I'm at a beggining of my programmer journey, this is my firt post, probably not last. So here is problem. I build portfolio project in React, using create-react-app. It was not necessary technology but I wanted to practice, by moving simple site to React. I used routes for multipage (there is only 2 pages). I used custom domain, because this will be site for my mother hairdresser salon, and Netlify free hosting. Here is link: https://bozena.net.pl/ I struggle with redirection for gallery (galeria). https://bozena.net.pl/pages/Gallery If I go directly there or refresh, its not working. I used API for pictures, if thats matter. I found out I need to use _redirects file in build folder, but I cant figure out exact syntax for this (I checked Netlify documentation about _redirects). For now my _redirects file looks like this:

/                   https://bozena.net.pl/#price-div 
/                   https://bozena.net.pl/#contact
/(whats here?)      https://bozena.net.pl/Gallery  

I tried different paths for this gallery, like /pages/Gallery (here is jsx file for gallery) but I didnt find anything working. price div and contact are divs on main page,and this directions will get me to main page. Anyone help me get this gallery link working? Here is code for whole page: https://github.com/kadynski/Hairdresser-app


Solution

  • Try this

    1. add a file in your project public folder name it as _redirects
    2. and then paste this code and save (and deploy) /* /index.html 200

    Source: https://answers.netlify.com/t/netlify-page-not-found-when-sharing-react-router-dom-based-links/11744/2