Credits

Dan Abramov's and Joe Savona's (both on the React core team at Meta) had two great episodes on the Javascript Jabber podcast that were incredibly helpful in putting this site's content together.

From them, I took lots of examples, explanations, and information to be able to succinctly describe what React Server Components are, why they're an evolution of React, and their benefits.

Dan Abramov's GitHub discussion, "RSC from Scratch. Pt. 1: Server Components" was also very insightful in taking a first principles approach to understanding server components and how they work.

If you're looking for a less technical overview, Sam Selikoff and Ryan Toronto from BuildUI and the Frontend First podcast have a great episode on Server Components breaking down their high-level differences from the current React model.

Ryan Florence, one of the core team members and creators of React Router and Remix, also has a great Twitter thread to explain the mental model of React Server Components as simply as possible:

Ryan Florence

@ryanflorence

·Follow

RSC in a nutshell: if you have to go to the server for JSON to render the next thing, why not just get the rendered thing?

369

Reply

Copy link

Read 29 replies

Kent C. Dodds (formerly on the Remix team and now working on EpicWeb.dev) has a great, free intro to React course that teaches a lot about going from explicit React.createElement() calls to JSX and what that looks like under the hood, which is super helpful to understand and differentiate the mental model between server and client components.

It was also very helpful to learn about React components and elements and their architecture from a much more technical standpoint from Dan Abramov's React Components, Elements, and Instances post on Medium from the early days of React pre-Hooks.

The official React docs are some of the best maintained docs I've read through, especially the new updated ones, and the docs about reconciliation and resetting state were incredibly insightful. As were the effects and state docs, though those are typically information found in any React course/video for entry level devs.

Theo (@t3dotgg) from Ping.gg has two great videos that help explain the mental model behind Remix and Next.js data flows, as well as what Server-Side Rendering does (in Next.js at least, but it's all about the same everywhere in terms of mental models).

Both videos were foundational in understanding why Server Components aren't an abstraction away from SSR, nor are they solving problems that SSR or existing meta-frameworks solved already.

This livestream from Kent C. Dodds, Dan Abramov, and Joe Savona on Server Components and how their mental model differs from existing solutions is also a great watch if you'd like to dive deeper into the weeds, and although it is a bit "spicy" as a commenter put it, each perspective gave a great amount of insight into where the landscape is for data-fetching/rendering solutions in React today.

Finally, Next.js's docs for the new app router were incredibly helpful in learning what it looks like to get up and running with React Server Components either from new project or from an incrementally adopted standpoint. The information there on how fetches work in server components, deduplication, the new "server actions" feature, etc. were all well explained, and helped me migrate two (small) production apps from the pages router to the app router for work without any issues with stability, bugs, or data leaks from server to client.