Week 10

Static Site Generators (I)

Intro

This week, you’ll follow a tutorial to understand the capabilities of static site generators and start to transform your Project 4 designs into HTML.

Sync Up

Activities

Note that this tutorial uses Sass rather than Less as its CSS preprocessor. For your final project you should feel free to use either one, but for now the main difference to keep in mind is that Sass uses the $ character at the beginning of variable names while Less uses @. Also note that Sass’s @import statement works a little differently than Less’s @import.

Also note that Glitch has its own Eleventy Starter Project Template that you can look at (and/or remix) if you want to consider other approaches to setting up a project directory.