11ty.dev

The official Eleventy site (11ty.dev) is the single entry point for everything: the Get Started and Quick Start pages cover installation and your first file, the Guide section holds the full reference documentation, and Starter Projects, Tutorials, and Community pages cover learning and support. If you only need one thing, start at the Quick Start on the homepage — it tells you to install Node.js (version 18 or newer), verify it with node --version, then create an index.md file.

Documentation: where each part lives

The site organizes docs into a few distinct areas, and knowing which one you want saves time:

The Guide is the largest section and is where most reference questions land. Its subsections include Command Line Usage, Add a Configuration File, Copy Files to Output, Importing Content, Permalinks, Layouts, Collections, Pagination, and Using Data in Templates. There is also a dedicated Template Languages area covering HTML, Markdown, MDX, JavaScript, JSX, TypeScript, WebC, Nunjucks, Liquid, Handlebars, Mustache, EJS, HAML, Pug, and Sass — so you can check support for your preferred language before committing to it.

Version information

The site lists Stable 3.1.6 and Canary 4.0.0-alpha.10. If you are starting a new project, the stable release is the one the documentation is written against; the canary build is for testing upcoming changes.

Tutorials and starter projects

Two separate resources serve different needs:

• Starter Projects — pre-built project scaffolds you can clone and modify. Useful when you want a working site structure rather than a blank directory.
• Tutorials — step-by-step walkthroughs. Useful when you want to understand each piece as you build it.

There is also Try Eleventy in Your Browser, which lets you evaluate the tool without installing anything locally. That is the fastest way to decide whether the template syntax suits you before setting up Node.js.

The Quick Tips page sits alongside these and collects shorter, task-specific guidance.

Community and events

The Community section links to several ongoing resources:

• Blog and Firehose — announcements and a stream of Eleventy-related posts
• 11ty Bundle — a curated collection of Eleventy resources
• Leaderboards — contributor activity
• Eleventy Meetup — a recurring community meetup
• 11ty Conference — a dedicated conference

There is also a How can I contribute? page and a Code of Conduct if you want to participate rather than just read.

Plugins, services, and deployment

Beyond core docs, the site documents an ecosystem:

Official plugins include Image, Fetch, Render, Internationalization (i18n), Upgrade Helper, RSS, Syntax Highlighting, InputPath to URL, Navigation, and HTML Bundle Id Attribute. There is also a Community Plugins listing and a Retired Plugins page, which is worth checking before adopting an older plugin.

Services covers Deployment & Hosting, Using a CMS, Runtime APIs, Screenshots, OpenGraph Image, IndieWeb Avatar Generator, Image Hosting, and Image Sparklines.

The Upgrade Helper plugin is specifically relevant if you are moving an existing project between major versions — check it before upgrading rather than after.

A practical path through the site

If you are new, this order avoids backtracking:

1. Try Eleventy in Your Browser — confirm the workflow fits how you think.
2. Quick Start — install Node.js 18+, create index.md, run the build.
3. Starter Projects — pick a scaffold instead of building structure by hand.
4. Tutorials — work through one end to end.
5. Guide — return here for reference as specific needs come up (collections, pagination, data cascade).
6. Common Pitfalls — read before filing a bug report.

For a specific decision — which template language, whether to use a CMS, where to host — the relevant Guide or Services page is the authoritative source, since these choices depend on your existing stack rather than on a single recommendation.

Eleventy (often written as 11ty) is a static site generator: it takes templates and content files and turns them into a static HTML website. According to its official site, 11ty.dev, Eleventy describes itself as "a simpler static site generator." It's aimed at developers who want to build for the web with JavaScript but without the overhead of a heavier framework. If you want plain HTML output, control over your templates, and a tool that doesn't force a specific front-end framework on you, Eleventy is built for that use case.

How Eleventy works

A static site generator sits between your source files and your published site. You write content (for example, Markdown) and templates, and Eleventy processes them into finished HTML files you can host anywhere.

The official site frames this around a few ideas:

• Simpler by design — the homepage tagline is "Eleventy is a simpler static site generator."
• JavaScript-based tooling — Eleventy requires a way to run JavaScript on your computer, and the docs recommend Node.js (version 18 or newer).
• Template flexibility — the documentation lists support for many template languages, including HTML, Markdown, MDX, JavaScript, JSX, TypeScript, WebC, Nunjucks, Liquid, Handlebars, Mustache, EJS, HAML, Pug, and Sass.

So rather than locking you into one templating system, Eleventy lets you mix and match the languages you already know.

What you need to get started

Before installing, confirm your environment. The official Quick Start gives these prerequisites and first steps:

1. Check for Node.js. Run node --version in a Terminal. Eleventy recommends Node.js version 18 or newer.
2. Install Node.js if needed. If node isn't found, or the reported version is below 18, install Node.js before continuing.
3. Create a content file. For example, create an index.md Markdown file in your text editor, or run one of the commands the docs provide for macOS, Linux, Windows, and cross-platform setups.

The docs also note you can try Eleventy in your browser, which is useful if you want to see how it behaves before setting up a local environment.

Why developers choose Eleventy

Based on the site's own framing, the appeal comes down to a few practical points:

The documentation covers advanced topics too — configuration, the data cascade, collections, pagination, the dev server, internationalization, and a programmatic API — so the "simple" positioning doesn't mean it's limited to trivial sites.

Where to go next

If you've decided Eleventy fits your project, the natural next steps from the official docs are:

• Get Started and Quick Start for installation and your first site.
• Why Eleventy? for the project's own rationale.
• Starter Projects and Tutorials if you'd rather learn from an existing setup.
• Plugins and Community Plugins when you need to extend functionality.

One note on versions: the site lists a Stable version (3.1.6) and a Canary version (4.0.0-alpha.10) at the time of the source material. If you're starting a new project, the Stable release is the safer default, while Canary is for testing upcoming changes.

Eleventy (11ty.dev) is a static site generator that turns templates and data into plain HTML files. Choose it if you want a lightweight build tool that does not lock you into one template language, and if you care about build speed and simple output. It is less suited if you want a batteries-included framework with a built-in CMS, client-side routing, or a large opinionated plugin ecosystem out of the box.

What Eleventy actually is

Eleventy is described on its own site as "a simpler static site generator." It takes your content and templates, runs them through a build step, and writes static files to an output folder. There is no required runtime on the server side — the result is static HTML, CSS, and assets you can host almost anywhere.

The site lists a "Why Eleventy?" section alongside Get Started, Performance, and Learn, which signals that the project positions simplicity and performance as core reasons to pick it.

The main reasons to choose it

It does not force a single template language

This is the clearest differentiator. Eleventy supports many template languages, and the docs list them explicitly:

• HTML
• Markdown
• MDX
• JavaScript, JSX, TypeScript
• WebC
• Nunjucks, Liquid, Handlebars, Mustache, EJS
• HAML, Pug
• Sass

You can mix languages in one project — for example, Markdown for blog posts and Nunjucks for layouts. Other generators often commit you to one templating system, which becomes a migration cost if your team already knows a different one.

Simpler mental model

The build pipeline is content plus templates plus data, producing static files. The documentation is organized around concrete tasks — Command Line Usage, Add a Configuration File, Copy Files to Output, Permalinks, Layouts, Collections, Pagination — rather than a large framework abstraction. If you have used a static site generator before, the concepts transfer quickly.

Performance-oriented

The site maintains a Performance section and a "Built With Eleventy" showcase. Static output means no server-side rendering per request, which is the baseline performance advantage of any static generator; Eleventy's own emphasis is on keeping the generator itself light and the build fast.

Data handling is a first-class feature

Eleventy has a documented data cascade: front matter data, template and directory data files, global data files, and computed data. It also supports JavaScript data files and custom data file formats, plus a validateData-style configuration area. If your site pulls from local files, APIs, or generated data, this is where Eleventy is stronger than minimal generators.

Extensibility without a heavy core

Plugins are opt-in. The docs list official plugins (Image, Fetch, Render, Internationalization, Upgrade Helper, RSS, Syntax Highlighting, InputPath to URL, Navigation, HTML Bundle, Id Attribute) and a separate community plugins section. You add what you need instead of inheriting a large default stack.

Where it is a weaker fit

• No built-in CMS. The docs point to "Using a CMS" as a separate concern. If you need an editing UI for non-technical authors, you bring your own (headless CMS, Git-based editor, etc.).
• No client-side app framework. Eleventy outputs static files. If you need a single-page application with routing and hydration, that is a different tool category.
• You assemble more yourself. Compared with all-in-one frameworks, you will make more decisions about structure, asset pipeline, and deployment.

Requirements and how to start

Eleventy requires a way to run JavaScript. The site recommends Node.js version 18 or newer.

1. Check your Node version in a terminal:

   node --version
   

   If Node is missing or reports a version below 18, install Node.js first.
2. Create a Markdown file, for example index.md. The docs show terminal commands for macOS/Linux, Windows, and cross-platform:

   echo '# Heading' > index.md
   

   On Windows PowerShell:

   echo '# Heading' | out-file -encoding utf8 'index.md'
   

3. Run the build (see the Quick Start and Command Line Usage docs for the exact command for your setup). The expected result is an output folder containing generated HTML.

There is also a "Try Eleventy in Your Browser" option on the site if you want to test it before installing anything locally.

Version context

The site currently lists Stable 3.1.6 and Canary 4.0.0-alpha.10. If you are starting a new project, the stable line is the safer default; the canary line is for testing upcoming changes. An Upgrade Helper plugin exists for moving between versions.

A practical way to decide

If your project is content-driven — a blog, documentation site, marketing pages, or a data-backed static site — and you want to keep the toolchain small and the template choice open, Eleventy is a reasonable default. If you need an editing interface or an interactive application, plan for an additional layer or pick a different tool.

To run Eleventy you need a way to execute JavaScript on your computer, and the official recommendation is Node.js version 18 or newer. Once Node.js is in place, you create a Markdown file such as index.md and run Eleventy to generate your site. The steps below cover checking your setup, installing Node.js if needed, and producing your first output.

Check whether Node.js is already installed

Open a terminal and run:

node --version

The expected result is a version number. If the command is not found, or the number is below 18, install Node.js before continuing. Eleventy's own documentation frames this as a prerequisite rather than an optional step, so treat the version check as the gate for everything that follows.

If you are unsure what a terminal is, Eleventy's docs link to a separate explanation — the short version is that it is a text-based way to run commands on your machine, available on macOS, Linux, and Windows.

Create your first content file

Eleventy works from files in your project directory. A minimal starting point is a Markdown file named index.md. You can create it in any text editor, or from the terminal.

On macOS or Linux:

echo '# Heading' > index.md

On Windows (PowerShell):

echo '# Heading' | out-file -encoding utf8 'index.md'

The expected result is a file containing a single Markdown heading. Eleventy will later turn that into HTML output.

Run Eleventy and verify the result

With Node.js 18+ available and index.md in place, run Eleventy from your project directory. The expected result is a generated output file (by default an HTML file derived from your Markdown). If you see output files appear, your setup is working; if the command fails, the most common cause is a Node.js version below 18 or Node.js not being on your PATH.

Where to go next

The Eleventy documentation lists several directions once the first build works:

• Starter projects and tutorials — pre-built structures you can copy instead of assembling configuration yourself.
• Template languages — Eleventy supports HTML, Markdown, MDX, JavaScript, JSX, TypeScript, WebC, Nunjucks, Liquid, Handlebars, Mustache, EJS, HAML, Pug, and Sass, so you can pick what you already know.
• Configuration — adding a config file, copy files to output, add CSS/JS/fonts, and set up permalinks, layouts, and collections.
• Plugins — including an Upgrade Helper plugin listed in the docs, plus Image, Fetch, Render, RSS, and syntax highlighting.

The current stable version shown in the documentation is 3.1.6, with a canary release at 4.0.0-alpha.10. The docs also offer a browser-based way to try Eleventy without a local install, which is useful if you want to see the output before committing to a Node.js setup.

Eleventy supports a wide range of template languages — from HTML and Markdown to JavaScript, TypeScript, WebC, Nunjucks, Liquid, Handlebars, Mustache, EJS, HAML, Pug, and Sass — and pairs them with a data cascade, layouts, collections, pagination, and a plugin/config system. You can mix languages within one project, so the practical answer is: pick whatever fits each file, and Eleventy will render it to static output.

Template languages

Eleventy's documented template languages fall into a few groups:

Because these are listed as supported template languages, a single project can use Markdown for blog posts, Nunjucks or Liquid for shared layouts, and JavaScript or TypeScript for data-driven pages. Eleventy also documents overriding languages and virtual templates, which matter when you want custom handling rather than the default file-extension mapping.

Content and data features

Beyond rendering syntax, Eleventy's content model is what lets you organize a site:

• Front matter data — per-file metadata, including custom front matter.
• Data cascade — the documented order in which data from template, directory, and global sources is merged.
• Template & directory data files and global data files — shared data scoped to a folder or the whole project.
• JavaScript data files and custom data file formats — generate data programmatically.
• Computed data — derive values from other data.
• Validate data — check data before it reaches templates.
• Layouts — wrap content in shared structure.
• Collections and the Collections API — group content and query it.
• Pagination and pagination navigation — generate multiple pages from one template.
• Permalinks — control output URLs.
• Content dates — drive ordering and date-based logic.
• Create pages from data — build pages directly from data sources.

Extending the build

Configuration and plugins cover the parts templates don't:

• Configuration file and global data for project-wide settings.
• Filters (url, slugify, log, get*CollectionItem, inputPathToUrl) and shortcodes (getBundle, getBundleFileUrl) for reusable template logic.
• Plugins, including official ones for Image, Fetch, Render, i18n, Upgrade Helper, RSS, Syntax Highlighting, InputPath to URL, Navigation, and HTML Bundle Id Attribute, plus community plugins.
• Preprocess and postprocess content hooks, ignore files, and environment variables.
• Internationalization (i18n) support.
• Watch files and dev servers, including the Eleventy Dev Server and Vite.
• A Programmatic API and configuration events for advanced builds.

Getting started with a template language

1. Confirm you can run JavaScript: Eleventy recommends Node.js version 18 or newer. Check with node --version in a Terminal; if it's missing or below 18, install Node.js first.
2. Create a content file, for example an index.md Markdown file, using your editor or a terminal command such as echo '# Heading' > index.md.
3. Add a layout or data file when you need shared structure or site-wide values.
4. Run the build and verify the generated output — the expected result is static HTML produced from your chosen template language.

Common pitfalls are documented under Common Pitfalls, and the Glossary and Quick Tips pages are useful when a term or behavior is unclear.

Choosing a language

There's no single required language. Use Markdown or HTML for straightforward content, a traditional templating language (Nunjucks, Liquid, Handlebars, Mustache, EJS, HAML, Pug) when you want logic in markup, and JavaScript, JSX, TypeScript, or WebC when you want components or programmatic rendering. If you're unsure, start with Markdown plus one templating language for layouts, then add others as the project grows — Eleventy's data cascade and collections work the same way regardless of which language a given file uses.