From the course: Build Modern Web Apps with React, Hooks, State Management, and APIs Using Vite or Next.js

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

Enhancing the error state with error component

Enhancing the error state with error component

From the course: Build Modern Web Apps with React, Hooks, State Management, and APIs Using Vite or Next.js

Start my 1-month free trial Buy for my team

Enhancing the error state with error component

“

Hello, and welcome back. Let's see how we can handle the error states gracefully and enhancing the user experience. As we read in the previous lessons, that the error message good examples are, it should be user friendly, and it should provide the user with a option to retry. So the user doesn't feel stuck. Right now, we are using a loader component, but the error message is simply a error, and this is showing the API error. Because whenever the catch block get hit, we are setting the error message, which is a generic message. This is good, but we can enhance it to be the best. For this, you can create a error component. This component has two parts to it. First is showing a general message, which is nice and friendly. So user should feel like something is communicating with it in human form. It should display a message and it will have a retry button, which is just going to reload the window for them in our case. Otherwise, if we have a specific reloading scenario, then we should…

Contents