Netlify Redirects 🧐

UpdatedMarch 2, 2023

•1 min read•View as Markdown

Netlify Redirects 🧐

ATUL KUMAR SINGH

Dedicated and efficient full stack developer with 8+ years of experience in application layers, presentation layers, and databases. Developed multiple web applications as a full stack developer to process, analyze, and render data visually. Worked on query optimization for the betterment of existing sections.

Today we will learn how to overcome netlify redirect issue for React web app

If you are using netlify I'm sure you face the above issue but when I'm here nothing to fear. Let's solve the issue of netlify redirect.

Now, what the issue is?? So the issue is whenever we try to access any internal route of our application directly it throws a 404-page error. Let's solve the issue.

Open your code editor.
Now go to the public folder and create a new file "__redirects".
```
    /*  /index.html 200
```
Paste the above code in your "__redirects" file.
Now this redirect rule which was just added to the public folder will always serve the index.html file not a 404 page.
Now commit your changes and build your project for production.
Now revisit the link.

its working GIF

Thanks a lot for reading till the end 🙏 You can contact me in case if you need any assistance:

Email: atul19251@gmail.com

Web: https://iamatul.netlify.app/

GitHub: https://github.com/iamrajput

LinkedIn:https://www.linkedin.com/in/atul-kumar-singh-673357102/

#reactjs #web-development #webdev #javascript #web3

Comments

Join the discussion

No comments yet. Be the first to comment.

More from this blog

🔐 SSL Pinning in React Native (iOS + Android) – A Practical Implementation

When we build mobile apps, we usually call APIs over HTTPS and assume everything is secure. But here’s the reality:Even with HTTPS, your app can still be vulnerable to Man-in-the-Middle (MITM) attacks

Mar 13, 20264 min read

🔐 SSL Pinning in React Native (iOS + Android) – A Practical Implementation

5 Deadly React.js Mistakes Every Beginner Makes (And How to Fix Them)

React.js is one of the most popular JavaScript libraries for building user interfaces. But as powerful as it is, many beginners fall into common traps that slow down their learning—and their apps. If you’ve been struggling with React, chances are you...

Jul 6, 20253 min read

5 Deadly React.js Mistakes Every Beginner Makes (And How to Fix Them)

🚀 Frontend Tip of the Day: Enhancing Performance with React.memo() 🚀

Did you know you can boost your React app's performance with just a single line of code? Meet React. memo()*! 🧠* What It Does:React.memo() is a higher-order component that optimizes your functional components by memoizing them. Essentially, it preve...

Oct 4, 20241 min read

🚀 Frontend Tip of the Day: Enhancing Performance with React.memo() 🚀

Ready to Fly?✈️ Middleware in Express.js is Your Boarding Pass!🎫

Imagine your web app as a passenger at an airport. Just like a flight passenger has to pass through several checkpoints before boarding the plane, an HTTP request has to pass through several "middlewares" before getting a response. Let’s walk through...

Sep 30, 20243 min read

Ready to Fly?✈️ Middleware in Express.js is Your Boarding Pass!🎫

Mastering Node.js Modules: A Clear Look at CommonJS vs ES Modules

If you're just starting with Node.js, you might have come across two different ways to import and export code: CommonJS and ES Modules. They might seem a bit confusing at first, but once you understand the basics, it’s really not that hard. What Are ...

Aug 16, 20242 min read

Mastering Node.js Modules: A Clear Look at CommonJS vs ES Modules

D

Dev Station

29 posts

Dedicated and efficient full stack developer with 6+ years of experience in application layers, presentation layers, and databases 🙂