EleventyOne is a free boilerplate starter for building static sites with the Eleventy static site generator, preconfigured for Netlify deployment and serverless functions.
What is EleventyOne?
EleventyOne is an open-source project scaffold created by Phil Hawksworth for starting new Eleventy sites. It provides a skeleton site with an Eleventy setup, Nunjucks templating with a Luxon-based date filter, a PostCSS pipeline, and a JavaScript pipeline. The project runs on Node.js and is designed to be deployed to Netlify, including local testing of Netlify redirects and serverless functions via Netlify Dev.
Key Features
- Eleventy skeleton — A minimal site structure ready to build on, using the Eleventy static site generator.
- Luxon date filter — A Nunjucks filter for formatting dates using the Luxon library.
- PostCSS pipeline — A tiny CSS processing pipeline that runs through PostCSS.
- Inline JS pipeline — A minimal JavaScript processing pipeline that keeps scripts inline.
- JS search index generator — Generates a search index for client-side search.
- Netlify Dev integration — Allows testing Netlify redirects and proxies locally using
netlify dev.
- Serverless functions pipeline — Includes Netlify Functions support, with example functions like
hello and fetch-joke.
- One-click Netlify deploy — A Deploy to Netlify button that clones the repo to your GitHub account and creates a new Netlify site.
Who is it for?
- Jamstack developers starting a new Eleventy project who want a working scaffold with Netlify integration out of the box.
- Developers new to Eleventy who need a minimal example of how to structure an Eleventy site with common pipelines.
- Netlify users who want to experiment with Netlify Functions and redirects inside an Eleventy project without configuring everything from scratch.
What can you do with EleventyOne?
- Deploy a site instantly: Click the Deploy to Netlify button, and Netlify clones the repository to your GitHub account and wires up a new site for you.
- Test serverless functions locally: Run
netlify dev and access functions like /.netlify/functions/hello and /.netlify/functions/fetch-joke.
- Use friendly redirects: Access the functions through proxied URLs like
/api/hello and /api/fetch-joke thanks to Netlify's Redirects API.
- Add search to your site: Use the included JS search index generator to build a client-side search index.
How does EleventyOne work?
- Click the Deploy to Netlify button, which clones the repository to your GitHub account.
- Netlify creates a new site linked to that repository, so future pushes trigger deployments.
- Clone the repo locally, run
npm install and npm run seed to stash external data, then npm start to build.
- For local Netlify features, install the Netlify CLI and run
netlify dev.
FAQ
Is EleventyOne free?
Yes, the scaffold is open source, hosted on GitHub under the philhawksworth/eleventyone repository.
What is EleventyOne?
It's a starting template for Eleventy sites, created by Phil Hawksworth, with Netlify Dev and serverless functions preconfigured.
Does EleventyOne include a CMS?
No, it doesn't include a CMS. It comes with a skeleton site, a CSS pipeline, and serverless functions, but you can add any CMS that works with Eleventy.
How do I deploy EleventyOne?
Use the Deploy to Netlify button, which handles cloning the repo and setting up a Netlify site. You can also deploy from your own Git repository by connecting it to Netlify.
