Build An Eleventy (11ty) Site From Scratch

ClockIcon19m
11ty11ty
Star icon$$$
Star icon$$$
Star icon$$$
Star icon$$$
Star icon$$$
4.5
Stephanie Eckles

Stephanie Eckles

Girl Geek, front-end focused software engineer, publishing a video series for beginner developers, authoring ModernCSS.dev(https:/...

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
Stephanie Eckles

Stephanie Eckles

Girl Geek, front-end focused software engineer, publishing a video series for beginner developers, authoring ModernCSS.dev(https:/...