A First Look at React’s New Server Components

A First Look at React’s New Server Components

Explaining the new approach to fetching data in React.js.

Yesterday, the React team announced a new feature: Server Components.

The feature is still experimental; there is no real documentation yet.

What it’s about is simply put: data & component fetching in React.js.

Server Components allow us to load components from the backend. The components have already been rendered in the backend and can be seamlessly integrated into the running app.

So it’s a bit like server-side rendering but works differently.

Similar to what you know from Next.js with getInitialProps, server components can fetch data and pass it to front-end components.

However, unlike classic SSR, Server Components are a bit more dynamic. We can fetch a server tree during the app's execution; the client state is not lost.

They also work differently technically. With SSR, our JavaScript code is rendered into HTML on the server. This creates an HTML template, which is the visible part of our web page.

This is sent to the client, plus the JavaScript code used for interactivity. Thanks to SSR, we see something earlier, but the interactivity can be delayed.

react reactjs javascript nodejs

What is Geek Coin

What is GeekCash, Geek Token

Best Visual Studio Code Themes of 2021

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

How native is React Native? | React Native vs Native App Development

Article covers: How native is react native?, React Native vs (Ionic, Cordova), Similarities and difference between React Native and Native App Development.

What is ReactJS? | ReactJS Basics | Learn ReactJS | React for Beginners | ReactJS Training

This Edureka video on "What is ReactJS ?" will help you understand the fundamentals of ReactJS and help you in building a strong foundation in React by understanding the advantages of ReactJS along with its features and major aspects.

React.js and NodeJS : Partnership Made in Heaven?

React and NodeJS are often used together. Are they made for each other, or is it just a matter of convenience? Read our React.js and NodeJS comparison to find out.

Increase Performance of React Applications Via Array JavaScript Methods

Increase Performance of React Applications Via Array JavaScript Methods. We will create a simple event management application in the react to add, update, and delete an event.

Full Stack Web Development Course [1] - ReactJS, NodeJS, NodeJS

Hey everyone, this is the first episode of this series where I will show how to create a full stack web app!