Page not found everytime I refresh the loaded page

[Abideen]

I deployed my react app successful on netlify. When it loads, everything loads perfectly but every time I refresh the site, I got page not found

Here is the site : https://abishoppy.netlify.app/

[nathanmartin]

@Abideen See this response I gave someone else, which applies to you:

Page Not Found when using home link or details page link

@blogfreerecipe This is occurring because your site is a react based SPA (Single Page Application). When you visit the site via the root / it is automatically loading the index.html which is your application, and then when you visit other pages you never actually leave the index.html page (it just looks like you do). So /recipeDetails/110133d3dd574821a9ab17b9d160d06d loads in additional data and simulates a browser page change. However when you make a fresh request for example by going to one…

If you want to know “why it works”, I provided this additional explanation here:

Can't Go To Page via URL Address Bar

@kautif What about it don’t you understand? It works because it proxies every request made to your site to the /index.html file, basically it returns the /index.html file no matter what URL you access the site via. So instead of a request to /user/games trying to return a file from /user/games.html (or /user/games/index.html), the proxy causes it to return /index.html at which point the route (/user/games) is handled by your react application… which only exists on that single index.html page.

[Abideen]

Thanks this works perfectly

[SamO]

Hi @Abideen welcome to the forums i’m glad nathan’s solution helped resolve your problem!

[anxheloo]

Hello, what can i do to solve this? Can you give a simple instruction please? Like creating a file in the public folder?

[anxheloo]

Hello, what are the necessary steps to solve this, please? Thanks in advance

[nathanmartin]

@anxheloo You should create your own thread and provide the details of what you’re working with.

There’s no “one size fits all” fix.

If you’re working with a react app though, and your issue is exactly the same as the original post, (which is that it all works fine until you hit ‘refresh’), then you can just visit the two threads that I linked to in the post above. Those posts explain both why it occurs and how to fix.