Route Rules in Nuxt - SSR, SSG, ISR and more

Introduction

Welcome back to another video on our channel! Today, we're diving deep into rendering modes in Nuxt.js. Previously, we discussed rendering modes in general. Now, let’s focus on how Nuxt.js handles these rendering modes, how to implement them, and understand their benefits and caveats.

Before we dive into the content, a quick reminder: if you want to join the VJs conference in Bonn, Germany, from the 8th to the 9th of October, there's a discount code for 10% off. Check out the description for the code. It's an amazing event with lots of expert talks on VJs, Nuxt.js, and more.

Let’s get started with rendering modes in Nuxt.js.

Getting Started

Nuxt.js is a versatile meta framework. It allows:

• Plain SPA
• Server-side rendering (SSR)
• Static site generation (SSG)
• Dynamic static site generation (ISR)
• Custom caching

In our demo application, we’ll walk through enabling and changing these on a per-route basis within Nuxt.js.

Disabling SSR Globally

If you want to disable server-side rendering for the entire application, you can set ssr: false in your nuxt.config.js. When you open your browser, it will showcase how a plain SPA behaves with no SSR involved.