I decided to create a static website to quickly access a list of instructions that I used most frequently to clean my home espresso machine. This was a good idea to improve my understanding of using a static site generator, templates, layouts, and data files.

For this project, I utilized Eleventy but there are lots of great options out there. I chose Eleventy because it’s highly configurable, it has 10 templating languages available and I was looking to publish truly static content with something that can be easy to get up and running, although I’m still a novice when it comes to Eleventy and static sites generators 👩‍💻. You can start working with Eleventy if you have some competency in HTML, CSS, and JavaScript. You don’t need to be an experienced developer.

Learning Process & Resources

• First I started reading about Static site generators to have a better understanding of the differences between dynamic and static sites. For this topic, I recommend this resource in particular from Tatiana Mac.

• Then I continue working on creating my first basic Eleventy website following the tutorial of 11tyRocks! created by Stephanie Eckles.

• I also looked into the official documentation to learn more about Collections and Layout Chaining.

Result

Website
Repository

Next Steps

My next project will be a simple landing page using Eleventy and Tailwind CSS with a design and descriptions provided by Frontend Mentor.