After talking to hundreds of developers and looking at thousands of Next.js repositories, I've noticed ten common mistakes when building with the Next.js App Router.

This video will share why these mistakes can happen, how to fix them, and some tips to help you understand the new App Router model.

0:00 – Introduction
0:13 – Calling Route Handlers from Server Components
1:59 – Static or dynamic Route Handlers
7:00 – Route Handlers and Client Components
9:03 – Using Suspense with Server Components
12:35– Using the incoming request
13:59 – Using Context providers with App Router
15:10 – Using Server and Client Components together
15:41 – Adding “use client” unnecessarily
17:51 – Not revalidating data after mutations
19:11 – Redirects inside of try/catch blocks

https://vercel.com/blog/common-mistakes-with-the-next-js-app-router-and-how-to-fix-them

#nextjs #react

Anja Petry

HTML

Community Picks is a section on daily.dev where our community members share the most interesting and valuable content they've discovered online. From insightful articles to handy tools, every post is a gem curated by our dedicated coomunity. To contribute to Community Picks, you need to have at least 250 reputation points, ensuring that only active and trusted members can share their finds.

Community Picks

Learn about common mistakes with the Next.js app router, such as calling route handlers from a React server component, understanding the defaults for route handlers, and using suspense with server components. Find out how to avoid these mistakes and improve your Next.js application.

10 common mistakes with the Next.js App Router