How can we nest layouts?

0-2 years experience

1. 1We have a simple blog page under /app/blog/post/[id]/page.js and we want a header that appears on every page of the site. How would you add a layout to achieve that?
2. 2If you place a layout.js file in /app/blog/ and another one in /app/blog/post/, which layout renders first and why?

2-5 years experience

1. 1You added a new sidebar layout under /app/dashboard/layout.js, but the sidebar disappears on some nested pages. What could be causing that and how would you debug it?
2. 2Our team wants the dashboard layout to fetch user permissions server‑side before rendering child pages. How would you modify the nested layout to support that without breaking other pages?

5-8 years experience

1. 1Explain the performance trade‑offs of deep nesting (3+ levels) of layouts in a large SaaS app. When would you consolidate layouts, and what impact does it have on caching and revalidation?
2. 2We need to share a global theme context across all layouts, but some nested layouts also need their own context. How would you structure the providers to avoid context clashes and unnecessary re‑renders?

8+ years experience

1. 1Our product is migrating from pages/ to the new app/ router across many micro‑frontends. How would you design a strategy for introducing nested layouts gradually while keeping backward compatibility?
2. 2Consider a multi‑team environment where each team owns a feature folder with its own layout. What conventions or tooling would you put in place to ensure layout composition remains predictable and doesn't cause CSS or state leakage?