Static Rendering

What are Server Components?

NextJS, a popular React Framework for building web applications, server-side rendering (SSR). NextJS 13 introduces several changes to the way components are created and rendered, including the introduction of React Server Components. Server Components are those components that perform server-side rendering. By default, In next.js all components are server components....

How are server components rendered?

In NextJS server component are rendered on the server-side, meaning that it initial rendering of the component happens on the server side rather than the client’s browser. There are the two steps in Next.js for rendering the Server component in the server side....

Static Rendering:

In NextJS, Static rendering refers to the process of pre-rendering pages at buld time, generating HTML files for each page that are served statically. This approach is beneficial for improving performance, SEO and user experience on the web application....

Dynamic Rendering:

In NextJS Dynamic rendering typically refers to rendering content dynamically on the server side in response to user request. It is different than static rendering. In this rendering HTML files generates content dynamically at runtime, often fetching the data from a external server or external API (Application Programming Interface)....

Streaming:

In NextJS, Streaming enables you to progressively render UI from the server. It means it split into chunks and streamed to the client as its becomes ready. This allows the user to parts of the page immediately, before the entire content has finished rendering....

Benefits of Server Rendering:

There are the many benefits of Server Side Rendering. I have explained some common Server Side Rendering....

Steps to Create the Project:

To run the server component, we need to create Next.js Project. For the purpose of demonstration....

Folder Structure:

...