Hello there,

Next.js is a very popular React framework and one of the beautiful features is the ability to build your web application using different rendering techniques, such as

• CSR - Client Side Rendering
• SSR - Server Side Rendering
• SSG - Static Site Generation
• ISR - Incremental Static Regeneration

In this post, I will focus on explaining and comparing these techniques using visual diagrams with minimal texts, and my goal is to create a short note that you can quickly refer when needed.

Having said that, this post does not cover advance technical details and code snippets, that you might want to learn as a web developer.

Let's get started..!