Genre: eLearning | MP4 | Video: AVC, 1280x720 | Audio: aac, 48 kHz
Language: English | Size: 684 MB | Duration: 7 episodes (2h42m) | Intermediate
A static site is often the ideal choice for certain types of projects. Common use cases might be portfolios, blogs, or documentation sites. They are easy to host, simple to implement, and incredibly fast. In this series, we'll take a look at a handful of the most popular static site generators.
Greetings! I'm Andre, a full-stack web developer and Laracasts instructor. My other hobbies include playing guitar, videography and gaming.
01 Jigsaw
Jigsaw allows you to create static sites using Laravel's Blade templating engine. We'll take a look at creating pages, layouts, using markdown, and collections.
View the source code for this episode on GitHub.
02 Nuxt
Next, let's take a look at using Nuxt.js to build a static site. We'll review simple routing, layouts, and rendering markdown content using the Nuxt content module.
View the source code for this episode on GitHub.
03 VuePress
Let's have a look at using VuePress to build a documentation site. You'll learn about a variety of features, including Markdown support, syntax highlighting, Vue components in Markdown, and more.
04 Saber
Next up, we take a look at using Saber to build static sites in Vue. Saber is simple to use, with a wide array of built in features and minimal configuration. In this example, we build a simple blog site and make use of features like Markdown for posts and pages, syntax highlighting, Vue components in Markdown, progress loading bars, and building the site for production.
05 Gridsome
Gridsome is a powerful static site generator in Vue that makes use of a GraphQL central store. We can source data using a variety of plugins or do it manually ourselves. In this episode, we take a look at the basics of Gridsome and build a basic blog implementation that makes use of local Markdown files.
06 Styling With Tailwind
Since we ignored the styling component in the previous episodes, let's now take some time to style our static site with Tailwind CSS. We'll re-visit the Nuxt.js example and add a design based on the Gridsome Portfolio Starter.
View the source code for this episode on GitHub.
07 Testing Static Sites With Cypress
Let's take a few moments to review how to test a static site using Cypress. Because no database is involved, these tests should be fairly trivial to write.
