---
title: "Handle \"Page Not Found\" in React?"  
description: "Handle \"Page Not Found\" in React?"  
author: "Utpal Vishwas"  
published: 2023-08-03  
updated: 2023-08-04  
canonical: https://www.mindstick.com/forum/159451/handle-page-not-found-in-react  
category: "javascript"  
tags: ["exception handling", "javascript", "reactjs"]  
reading_time: 2 minutes  

---

# Handle "Page Not Found" in React?

[Handle](https://www.mindstick.com/articles/311004/suede-skillet-handle-cover) "[Page Not Found](https://www.mindstick.com/articles/1498/custom-error-page-in-asp-dot-net-mvc-4)" in [React](https://www.mindstick.com/articles/327892/react-why-it-just-makes-sense-for-web-development)?

## Replies

### Reply by Aryan Kumar

There are a few ways to handle a [page](https://www.mindstick.com/articles/13031/why-to-make-a-wikipedia-page) not found error (404) in React. One way is to use the `NotFound` component from the `react-router-dom` library. The `NotFound` component will render a generic 404 page, which you can customize to fit your needs.

```plaintext
import React from 'react';
import { NotFound } from 'react-router-dom';

const App = () => {
  return (
    <div>
      <h1>My App</h1>
      <Route path="/about" component={About} />
      <Route path="/contact" component={Contact} />
      <NotFound />
    </div>
  );
};

export default App;
```

Another way to handle a 404 error in React is to create your own custom 404 component. This can be helpful if you want to create a more specific 404 page that is tailored to your application.

Here is an example of a custom 404 component:

```plaintext
import React from 'react';

const NotFound = () => {
  return (
    <div>
      <h1>404 Not Found</h1>
      <p>The page you are looking for could not be found.</p>
      <p>Please try again or contact us if you need help.</p>
    </div>
  );
};

export default NotFound;
```

No matter which method you choose, it is important to handle 404 errors in React gracefully. This will help to provide a better user experience for your visitors.


---

Original Source: https://www.mindstick.com/forum/159451/handle-page-not-found-in-react

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.