eleventy-base-blog VS hax11ty

11ty is a lightweight static site generator. I chopped up my HTML and used the 11ty starter template called eleventy-base-blog as the structural foundation for the site.

Sure! It's on github at https://github.com/nosecreek/dustin-lammiman - I started with https://github.com/11ty/eleventy-base-blog for the basic templating logic.

Eleventy Base Blog demo site Source

To generate a static blog, we will be using Eleventy. Using the blog example from Eleventy as a base for our blog. Clone the repository:

I would do this with Eleventy which is a powerful static site generator with support for html partials (partial is what I call your toolbar here). You would use the template language nunjucks which Eleventy comes with support for, or you can choose plain html too if you don't want the Nunjucks capabilities for logic like if/else, for loops, javascript injection of dynamic values in your html at site generation time, etc. This repo shows most of the techniques you could need and use: https://github.com/11ty/eleventy-base-blog

For the second site I made using 11ty, I used this repo which is a more advanced 11ty template that can be customized. After following the instructions in the README.md file and edited all the markdown I came up with this:

Pre-established Eleventy Blog Template Go to eleventy base blog to clone the repository to your local file/folder.

The next example we'll look at goes more into depth of 11ty. We are creating this site from this template.

Say you want a more professonal looking site without having to do a lot of extra work, you’re in luck! 11ty has a community that has created templates that are available at this site. For this example, we will use the eleventy-base-blog, make sure to go to this repo and select the USE THIS TEMPLATE button to make a copy of the project in your namespace.

The incredible resource that is HAX also has an 11ty website template that can be used, this can be found here This template is incredibly useful as it provides far more customization and deployment options then the previous template. The instructions provided in the template walk you through how to edit the files and was incredibly helpful. Especially when you're still getting used to using 11ty. Github Repo

Using HAX11ty to Build the Same Blog

Links to relevant sites (11ty, hax11ty) as well as the code for your repos and you github.io addresses for the sites hax11ty hello world my repo: TBA

For our third and last method that we will be demonstrating, we will be using another template but it simplifies how we can deploy in a static form. To start, you will need yarn installed on your machine. You can use the template and create your own repository. [https://github.com/elmsln/hax11ty]

The final 11ty site I made was using hax's hax11ty template, which is already a very functional and complicated 11ty site. The template can be found here. I added my blog posts to this as well and they can be seen in the left hand column of the site. The github repo is here and the working site is here.

More information Source Repo

Finally, using the final template found here, we are able to build the last blog. Originally, I had tried to use npm to operate this one, but you do require yarn to be downloaded. You can do so following the directions here. This is what I ended up with for this template.

This one was fairly easy, all I had to do was use this template, clone it, yarn install, and yarn start. Originally, npm was used, but I ran into some problems, so yarn is used instead.