Building a 11ty website in a weekend

This page summarizes the projects mentioned and recommended in the original post on dev.to

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • WorkOS - The modern identity platform for B2B SaaS
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • gatsby-starter-lumen

    A constantly evolving and thoughtful architecture for creating static blogs with Gatsby.

    Until now, my personal website was using a Gatsby with a beautiful template named Lumen. Since I don't want to re-write my website every year to follow the latest trend in React world and since I couldn't change much without learning the framework, I've decided to switch to something else. Many static site generators needs several days or weeks to be mastered, so I went for the simpler solution to be able to build the first version of my website in a weekend: 11ty.

  • eleventy 🕚⚡️

    A simpler site generator. Transforms a directory of templates (of varying types) into HTML.

    Until now, my personal website was using a Gatsby with a beautiful template named Lumen. Since I don't want to re-write my website every year to follow the latest trend in React world and since I couldn't change much without learning the framework, I've decided to switch to something else. Many static site generators needs several days or weeks to be mastered, so I went for the simpler solution to be able to build the first version of my website in a weekend: 11ty.

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  • low-impact-website-checklist

    Checklist to build low-impact website

    I built the website with the requirement to get a perfect lighthouse score and following some low-impact website guidelines. I still need to optimize the pictures section, but for the rest I managed to get a score of 100. In this first version, I used font-sans that use OS font and avoid downloading any font.

  • pierre.bresson.io

    Discontinued Personal website made with 11ty, Tailwind & Alpine.js

    You view the result on pierre.bresson.io and check the code on Github.

  • Tailwind CSS

    A utility-first CSS framework for rapid UI development.

    If you want to create a small lightweight website, easy to maintain and build, I highly recommend 11ty with the combination of Tailwind and Alpine.js

  • Alpine.js

    A rugged, minimal framework for composing JavaScript behavior in your markup.

    Alpine is a lightweight library that helped me to build the menu for mobile screen. I use the attribute x-bind for hiding/showing the hamburger menu. Very easy, I recommend it.

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts