11ty Easy Start

About

11ty is an extremely versatile and configurable static site generator that allows you to work with the template system that best suits your project. Whatever your project, you can configure 11ty as you see fit and continue to use the template system of your choice from a large list of options:

HTML (*.html)
Markdown (*.md)
JavaScript (*.11ty.js)
Liquid (*.liquid)
Nunjucks (*.njk)
Handlebars (*.hbs)
Mustache (*.mustache)
EJS (*.ejs)
Haml (*.html)
Pug (*.pug)
JavaScript Template Literals (*.jstl)

11ty Easy Start's goal is to have a quick and easy tool that allows you to start working using 11ty and Sass for your projects with a minimum of setup.

Install

For start working with 11ty Easy Start, just download this repo and run the following command in the project root:

npm i

This command install all the dependencies you need to start working.

Structure

The structure of 11ty Easy Start is as follows:

/+src

                    |  +_includes

                    |  +img

                    |  +js

                    |  +sass

                    |  -index.html

                    -LICENSE

                    -package-lock.json

                    -package.json

                    -README.md

The root folder where the project resides is the SRC folder. Inside you can find a basic structure with folders for images, Javascript and Sass and an index.html file.

There is also a folder named _includes with a default.liquid file inserted as an example. This folder is where 11ty looks for template files by default.

Command

There are two basic command for star developing with 11ty Easy Start:

npm run serve

This commands build the site and deploy it within the DIST folder which is created automatically. The command start also a Browsersync server (built-in 11ty) and watch th img, js and Sass folder for update. When an update occour Browsersync re-build again the site and update the files into the DIST folder.

npm run build

This commands build the site and deploy it within the DIST folder without starting a Browsersync server.