Learn Eleventy

Learn Eleventy

Welcome to Learn Eleventy! This course is designed to give you a really solid understanding of Eleventy—even if you’ve never used it before. Over the course of 31 lessons, you’ll start with a completely empty directory and finish with a fancy, fully-fledged website.

Not only will you have solid skills in Eleventy at the end of this course—you’ll also have skills in semantic HTML, progressive CSS, user experience, accessibility, progressive enhancement and performance. It’s an all-in-one course on building an awesome website!

In fact, why explain what we’re building when I can just show you?

View the demo!

Pretty neat, huh?

Before we dive in, let's take a quick tour of how to use and navigate this site:

  • On the left panel, you'll find a navigation menu that allows you to jump to any lesson in the course. At any time, you can press / to open the search menu and search for a lesson by name or content.
  • Each lesson is divided into sections and you can navigate to a specific section by clicking on the section title in the table of contents on the right panel.
  • The panel on the right also contains a few other things:
    • A resources section, which contains useful links for all the tools and resources used in the course.
    • An "edit this page" button, which allows you to edit the content of the current lesson on GitHub.
    • And finally, you can bookmark any lesson by pressing the bookmark icon to save it for later.
  • If you ever get lost or want to go back to a previous lesson, you can use the "Previous" and "Next" links at the bottom of each lesson.
  • Don't forget that you can always refer back to the demo site for inspiration or guidance as you work through the lessons.

Ready? Let's get started! Head over to the first lesson by clicking the "Lesson 1: Introduction" link below.


Lesson 1: Introduction