Implement server-side rendering (SSR) in React 18 using Pipeable Stream in NodeJS – step by step

Publicado em: 26 Outubro 2023
no canal de: Codeching

4,110

In this tutorial I show you that how you can use the SSR (server-side rendering) technique to be able to render a React 18 client application on the server side (node js). We will use a Pipeable Stream to stream the components to the client side as soon as they are ready. It provides a smooter solution versus the old way where node application had to wait the full HTML content to be produced before it could send the content to the client. From the user perspective it's a faster and smooter solution. The user can see content much more earlier. We will also use lazy loading for a component and Suspense too in the React application. Suspense is now working along with SSR in React after version 18.

The final source code repository could be found here: https://gitlab.com/codeching/react-18...

00:00 - Intro
02:21 - Setting up the project (server and client side - workspaces)
05:34 - Writing the front-end React application - components
08:34 - Testing the front-end application
09:38 - Writing the Node.js application (babel, SSR)
14:59 - Writing the main server-side rendering function (pipeable stream)
17:20 - Hydration
17:59 - Testing the whole server-side rendered Node.js application
20:46 - Outro

#react #nodejs #serversiderendering

Nesta página do site você pode assistir ao vídeo on-line Implement server-side rendering (SSR) in React 18 using Pipeable Stream in NodeJS – step by step duração hora minuto segundo em boa qualidade , que foi baixado pelo usuário Codeching 26 Outubro 2023, compartilhe o link com seus amigos e conhecidos, no youtube este vídeo já foi visto 4,110 vezes e gostou 65 espectadores. Boa visualização!

3,223

127