In this lesson, let's take a look at some of the available static site generators and talk about why I've chosen to use Nuxt. org slash generators, you can see a pretty comprehensive list of static site generators, or SSG for short. In fact, there are 335 of them to choose from. Many of them are built with JavaScript and target popular frameworks like Vue, React, or Svelte.
But others are built in other languages like Go or PHP. The one that Smashing Magazine uses is a Go-powered SSG called Hugo. Another pretty popular one is called Eleventy. It's a simpler static site generator that's powered with JavaScript.
It supports multiple template languages so you can choose your preference and ships with zero boilerplate JavaScript to the browser by default, making it a very lean option. js and Gatsby, are for use with React. Unlike Eleventy, they do ship boilerplate JavaScript code to the browser. That way static HTML can be quote unquote hydrated and turned into a full-fledged React application.
The static HTML is great for SEO and for fast initial load times. Well, the hydration means that you can ship a highly interactive app with SPA-like page navigation. This is the same approach that all of your view-powered static site generators will take. They ship static HTML, but then hydrate them as a view app on the client side.
A number of the SSGs for view are built specifically for the purpose of creating documentation, like Docsify, ViewPress, and Vpress, though they can be used for other things as well. Astro which is listed here under the Vue SSGs, actually takes a little different approach. It works with all of the popular front-end frameworks, and it removes the hydration bit by default, allowing you to only choose small islands of interactivity to ship partial hydration for. This means that you can still work within your desired framework, but you can easily ship more static websites that only have to have interactivity here and there.
This is great for performance and great for developer preference as well. Astro really has become a major player in the static site generator game and has become super popular over the last few months. The most popular option by far though for Vue is in fact Nuxt and it's what we'll be using during this course. Besides being most popular, There are a variety of solid technical reasons why we'll be working with Nuxt.
Reason one is that Nuxt supports incremental static site generation. This means that it has out of the box support for rebuilding only select pages during build time and then using caches for unaffected pages. Reason number two is that Nuxt does have a very active community of developers providing their support with resources such as pre-built modules, and plenty of blog posts and docs. Finally, reason number three, the developer experience with Nuxt is just absolutely fantastic.
If you like building with Vue, you're going to love building with Nuxt. It makes a number of opinionated decisions for you so that you can focus on writing your Vue code. All right, now that you have a good understanding of what the Jamstack is, and a good overview of what kind of tools that you have at your disposal, then let's get building our app on the Jamstack. We'll do just that in the next lesson.
In this lesson, let's take a look at some of the available static site generators and talk about why I've chosen to use Nuxt. org slash generators, you can see a pretty comprehensive list of static site generators, or SSG for short. In fact, there are 335 of them to choose from. Many of them are built with JavaScript and target popular frameworks like Vue, React, or Svelte.
But others are built in other languages like Go or PHP. The one that Smashing Magazine uses is a Go-powered SSG called Hugo. Another pretty popular one is called Eleventy. It's a simpler static site generator that's powered with JavaScript.
It supports multiple template languages so you can choose your preference and ships with zero boilerplate JavaScript to the browser by default, making it a very lean option. js and Gatsby, are for use with React. Unlike Eleventy, they do ship boilerplate JavaScript code to the browser. That way static HTML can be quote unquote hydrated and turned into a full-fledged React application.
The static HTML is great for SEO and for fast initial load times. Well, the hydration means that you can ship a highly interactive app with SPA-like page navigation. This is the same approach that all of your view-powered static site generators will take. They ship static HTML, but then hydrate them as a view app on the client side.
A number of the SSGs for view are built specifically for the purpose of creating documentation, like Docsify, ViewPress, and Vpress, though they can be used for other things as well. Astro which is listed here under the Vue SSGs, actually takes a little different approach. It works with all of the popular front-end frameworks, and it removes the hydration bit by default, allowing you to only choose small islands of interactivity to ship partial hydration for. This means that you can still work within your desired framework, but you can easily ship more static websites that only have to have interactivity here and there.
This is great for performance and great for developer preference as well. Astro really has become a major player in the static site generator game and has become super popular over the last few months. The most popular option by far though for Vue is in fact Nuxt and it's what we'll be using during this course. Besides being most popular, There are a variety of solid technical reasons why we'll be working with Nuxt.
Reason one is that Nuxt supports incremental static site generation. This means that it has out of the box support for rebuilding only select pages during build time and then using caches for unaffected pages. Reason number two is that Nuxt does have a very active community of developers providing their support with resources such as pre-built modules, and plenty of blog posts and docs. Finally, reason number three, the developer experience with Nuxt is just absolutely fantastic.
If you like building with Vue, you're going to love building with Nuxt. It makes a number of opinionated decisions for you so that you can focus on writing your Vue code. All right, now that you have a good understanding of what the Jamstack is, and a good overview of what kind of tools that you have at your disposal, then let's get building our app on the Jamstack. We'll do just that in the next lesson.