Build An Eleventy (11ty) Site From Scratch

19m
Star icon$$$
Star icon$$$
Star icon$$$
Star icon$$$
Star icon$$$
4.5
166
people completed
Bookmark
Download
RSS

Start from a blank project and build up to an Eleventy site that includes a blog collection and is prepared to source content from a headless CMS. You'll also learn how to add Sass as the styling solution, complete with triggering 11ty to re-compile when the Sass changes.

These lessons will help explain key 11ty features and concepts to help you make the most of this amazing static site generator.

By the last lesson, you'll have learned how to:

  • define custom input and output directories
  • create a layout that accesses front matter variables
  • watch for Sass changes and include CSS in the build proces
  • create an 11ty collection using tags
  • define front matter for an entire collection
  • make and apply a filter to a collection
  • generate pages from an external data source, such as a CMS or API

Instructor

Stephanie Eckles

Girl Geek, front-end focused software engineer, publishing a video series for beginner developers, authoring ModernCSS.dev, creator of Style Stage, providing Eleventy resources on 11ty.Rocks, and mom of two girls.

My lessons focus on HTML, CSS, Sass, accessibility, and Eleventy.

Course content (5 lessons)

    illustration for Build An Eleventy (11ty) Site From Scratch