A shared base implementation for the websites I build at Industrious One. Built on Eleventy and drawing heavily from Eleventy Excellent and Eleventy Base Blog.
Rather than a starter site that you clone and edit, this code sits inside your Eleventy project's _includes folder at _includes/base. It doesn't provide any of the top-level files or content, so there's nothing to "undo" when you start a new site, and you can update to the latest version easily without worrying about merge conflicts. Pick and choose which pieces to use and ignore the rest.
I'm adding things as I need them. This is all for my own use so it's all going to be very opinionated, and they are all going to be my opinions.
- Starter layouts at
./layouts - Extended Markdown syntax. Abbreviations, anchors, emoji, footnotes, smart typography for starters; see
./configs/markdown.config.js. - Clean, human readable generated markup. I grew up on the early internet learning how it all worked by viewing the source of other people's sites. This is a little effort to pay it forward.
Starting with an empty project folder add a package.json. Note the reference to the shared code package in devDependencies; we'll satisfy that in a moment.
{
"name": "my-website",
"version": "1.0.0",
"private": true,
"scripts": {
"build": "eleventy",
"watch": "eleventy --watch",
"serve": "eleventy --serve",
"start": "eleventy --serve",
"debug": "DEBUG=* eleventy"
},
"devDependencies": {
"base": "file:./src/_includes/base"
}
}While you're there, add an eleventy.config.js as well, and use it to pull in the shared configuration.
const base = require('./src/_includes/base/configs/base.config.js')
module.exports = eleventyConfig => {
return base(eleventyConfig);
};Create a skeleton site.
$ mkdir src src/_data src/_includes
$ echo '# Welcome to My Site' > src/index.mdWhen I'm building my own sites I pull in this base code as a Git submodule located at src/_includes/base. That allows me to easily add fixes and features to the base while building out the downstream sites, and not bother with hosting NPM modules. You could also submodule your own fork of it, or just copy the code to that same location.
$ git submodule add \
https://github.com/starkos/industrious-publish \
src/_includes/baseFinally, copy base/samples/metadata-sample.js to src/_data/metadata.js and edit to suit. Then npm install && npm start and http://localhost:8080/ and you're off to the races.
Here are some sites I'm in the process of building on this code. If you use it for a project of your own, and would like a link here, just submit a PR with the change.