Comparing different rendering methods in React | CSR vs SSR vs SSG vs ISR | step by step tutorial

In this tutorial I show you four different rendering methods that you can use in case of a React application to render your content. I will introduce you the client-side rendering (CSR), the server-side rendering (SSR), the static site generation (SSG) and the incremental static re-generation (ISR). We will go trough this rendering methods in-detail with an example and finally we will extend our server-side rendering solution that we wrote in our previous tutorial with a caching mechanism to improve it to incremental static re-rendering (ISR).

You can find the server-side rendering repository here, which is used in the tutorial as a starting point:

https://gitlab.com/codeching/react-18...

00:00 - intro
01:25 - client-side rendering
06:33 - server-side rendering
14:56 - static site generation
17:06 - incremental static re-generation in detail
37:43 - outro

#react #nodejs #serversiderendering #incrementalstaticregeneration

• #science_technology
• #server_side_rendering
• #react
• #ssr
• #context_api
• #ssr_i18n
• #i18next
• #ssr_staticrouter
• #staticrouter
• #browserrouter_ssr
• #backend
• #frontend
• #express
• #server_side_router_react
• #i18nextprovider
• #pipeable_stream
• #suspense
• #lazy
• #react_18
• #react_18_ssr
• #react_18_server_side_rendering
• #react_stream_ssr
• #react_ssr_streaming
• #react_ssr_stream
• #incremental_static_regeneration
• #isr
• #client_side_rendering
• #csr
• #static_regeneration
• #ssg