/layout.js @ 1688734135484 [Home]

Demystifying React Server Components
with NextJS 13 App Router

This purpose of this application is to demonstrate the concepts and code of React Server Components in NextJS13 in a way that exposes what is really happening.

Audience: Experienced React developers who are perhaps new to RSC. Or people using RSC who want to understand more about how it works.

Clone on GitHub.

This tutorial is intended to be stepped through linearly, but you may jump to any page below.

Important Notes

Contents

  1. Important Notes
  2. Static Content
  3. Virtual DOM
  4. Integrating Client Components
  5. Hydration Failure
  6. Disabling SSR for Client Components
  7. Disabling Component SSR Server-Side
  8. Client Component Details
  9. Server Components as Children of Client Components
  10. Importing Server Components into Client Components
  11. async Server Components
  12. Streaming with Server-Side Suspense
  13. Dynamically Updating Server-Rendered Content
  14. RSC Caching
  15. Server Functions?
  16. RSC FAQs
  17. App Router Demos (These are very much a WIP, converting and improving from an old demo)