Next.js App Router in Depth
LESSON 1.2

Layouts, templates, and shared UI

Learn key techniques and workflows in Next.js App Router in Depth.

6m
intermediate
17,298 students

Overview

Layouts persist across navigations and keep their state; templates remount on every navigation. Choosing the wrong one is why your sidebar scroll position keeps resetting.

In this lesson you will:

  • Nest layouts to share chrome across a section
  • Know when state persistence makes a template the wrong choice
  • Colocate loading and error UI with the layout it belongs to

Pro Tip

Use caching and revalidation wisely to ensure your app stays fast and data remains fresh without unnecessary requests.

Resources