Published

Sass + Eleventy, remember to opt out of using .gitignore

I’m working on an Eleventy site at the moment, the first Eleventy site I’ve done that’s been complex enough CSS-wise to warrant using Sass. I’ve turned to Phil Hawksworth’s Sass + Eleventy technique for the job. It’s a great, simple way of using Sass with Eleventy with a little bit of preprocessing courtesy of Gulp.

Hit a wall at one point though, it was smooth sailing and then my CSS updates just stopped working.

Turns out I had added /_includes/main.css (the compiled styles) to my .gitignore file since I prefer not to commit compiled files, but I forgot that Eleventy uses the .gitignore file + the .eleventyignore file to decide what not to compile. So Eleventy was just ignoring it. 🤦🏻‍♀️

I did this .gitignore change as an end-of-day commit, tidying things up before closing my laptop. When I picked the project back up days later, it took me longer than I’d like to admit to figure out what was going on!

To sort it, I just had to opt out of using .gitignore by adding eleventyConfig.setUseGitIgnore(false); to the .eleventy.js config file, and then adding the necessary files listed in .gitignore to .eleventyignore. Then I re-ran gulp watch & npx eleventy --serve, and all was well.

Separate but related to static site generators: Check out Astro. Would be curious to see a detailed comparison of Eleventy vs Astro since Eleventy is currently top-of-the-list for me in terms of static site generators.

Published

Thoughts on LAMP vs JAMstack content management systems

Chris Coyier recently published a CSS-Tricks post titled “WordPress and Jamstack”. It’s a great rundown of the pros and cons, and I’m in agreement on the whole.

The most important point for my own use cases is from the section titled “CMS and End User UX”.

Sometimes, we developers are building sites just for us (I do more than my fair share of that), but I’d say developers are mostly building sites for other people. So the most important question is: am I building something that is empowering for the people I’m building it for?

I really enjoy working on JAMstack (JavaScript, APIs, Markup) sites, the dev environment can be spectacular. It’s wonderful to not worry about deployment, HTTPS, caching. BUT. I haven’t yet found a JAMstack content management system (CMS) that I love, so it’s not something I feel super comfortable reaching for in the majority of my client work.

Read more

Published

Tom Hackshaw’s site

I had a lovely convo with NZ-based web worker Tom Hackshaw during a digital coffee a little while back, ended up sending him a link to Portfolio Starter once Sam and I finally wrapped it up. I had the good fortune of coming back across him recently when I accidentally sent an email to him instead of another Tom (oops! shows how mistakes can be good tho). Saw that he’s using Portfolio Starter, which is sweet! Better yet, he’s got an excellent blog going and a very commendable accessibility policy (I still need to get round to that…). Check his site out at the link below, or follow him on RSS.

tom.so

Published

Use Portfolio Starter to create a personal site with projects, pages, and posts

Screenshot of Portfolio Starter

This tutorial will teach you how to set up a personal website using Portfolio Starter, a starter kit for portfolio-driven websites made by Sam Baldwin and me. Check out the demo site to get a feel for how it looks, and visit the GitHub repo for more on how it works.

The tutorial is geared towards people that have little-to-no coding experience and are unfamiliar with things like GitHub, Eleventy, and Netlify. By the end of the tutorial you should understand terms like “repository” and “static site”; you’ll be able to edit your projects, pages, and posts; and your website will be hosted for free. Though basic experience with code such as HTML or CSS may be useful, it isn’t necessary for this tutorial since we’ll be using the hosting user interfaces to set this all up.

Let’s get started