Next.js Error Handling Patterns || Common Mistakes To Avoid

Enjoying my videos & teaching? Join tapaScript as a member:

I take special care to provide you the best quality content. Please SUBSCRIBE to the channel to show your support. Also, could you like/comment on this video so that it reaches others? Thanks! 🫶

Timecodes
0:00 - We Will Learn These
01:24 - Understanding Error Boundaries
04:12 - Layouts, Pages, Error Boundaries
13:19 - Project Setup
18:20 - Error Handling on Root Route
26:21 - Error Handling on Subroutes
27:00 - Handling Layout Errors
32:34 - Top Layout Error Handling at Global
35:30 - Server Actions and Error Handling
41:10 - What's Coming Next?

## Videos mentioned:

## Source Code on tapaScript GitHub:

## Join tapaScript

## 🤝 My Links:

## 👋 Like my work? Thank You. You can sponsor me from here:

## About Me:
Tapas Adhikary is an Educator at tapaScript, Tech enthusiast, Writer, YouTuber, and Open Source projects maintainer/contributor. He is a full-stack developer with vast experience in building SaaS solutions. He is the founder of the ReactPlay platform, which is driven by open-source projects and a fast-growing community.

#nextjstutorial
#next
#nextjs14
#nextjs
#nextjs13
#nextjsapprouter
#thinkinginnextjs
#nextjstutorial
#errorhandling
#designpatterns

[notRadioOpaque]

Ah that's it! I kept wondering why the global-error boundary page wasn't being rendered during dev. Thank you Tapas!

[AnwerJahid-gt]

Thank you very much for your very informative tutorials. I'm enjoying a lot. 41:38 you said that your are going to discuss on "not found" but didn't.

[EasinTanvir]

25:31 The custom error message thrown from page.js is successfully caught in the error.js file, but it only works on the development server. In the production server, Next.js does not allow custom error messages to be displayed. Instead, it shows a generic message, claiming this is done for security reasons.

The error message shown in production is:
“An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details.”

Is there any way to display my custom error message in production, just like in the development server?

[akbarsheikh]

Sir I love the way you teach .With so much clarification

[luner_lynx]

Very Clear Explaination ... once some one watch this properly it will tough for him to forget the concepts i believe... Thanks.

[legiampaoli]

As always, extremely good explanation. I come mainly from backend, and your videos are being valuable building my SaaS using NextJs for front end.

[akbarsheikh]

Your video is amazing with so much details.And the way you teach sir

[bojanarcon]

Good job buddy, keep them comming 🤘
Is there a chance to do a video on error handling of services in NextJS with ReactQuery and tRPC? More as a centralized solution where we can customize what we want to show in log and what to the public.

[phillipjacowski]

good video but what was missing for me was how to catch errors when prefetching data from a server component

[zenobiusztasak]

Hi. Is there a possibility to redirect into error.tsx or error-global.tsx from client component without changing url ? I wonder how to manage client side errors

[deepakkumarchouhan]

Hello I am working on nextjs project in company can you help me to add error handing to avoid an error so that my app not crashed? If you have a time let me know Thankyou

[webdeveloper]

Awesome video.... Unfortunately I can't like more than once. My one like ===1M like...

Thanks