Zach Leatherman
フィード
The Best And Worst Parts Of Eleventy (Now In v3)—Web Unleashed 2024
Zach Leatherman
Here are the slides from my talk at Web Unleashed: tag to during serve or build modes" width="1000" height="562" srcset="https://www.zachleat.com/img/built/jg2FpWoLnv-600.jpeg 600w, https://www.zachleat.com/img/built/jg2FpWoLnv-1000.jpeg 1000w" sizes="(min-width: 106.25em) 82.75em, (min-width: 61.25em) calc(91.43vw - 13.25em), 100vw"> versus ? Don’t worry about it" width="1000" height="562" srcset="https://www.zachleat.com/img/built/lJu89sPctW-600.jpeg 600w, https://www.zachleat.com/img/built/lJu89sPctW-1000.jpeg 1000w" sizes="(min-width: 106.25em) 82.75em, (min-width: 61.25em) calc(91.43vw - 13.25em), 100vw">< PreviousNext >Unfortunately the talk was not recorded (by the event or me) so you’ll have to ask questions about the slides if you want more context!Panel DiscussionI was also honored to participate in a panel alongside Chris Coyier, Rachel Andrew, and Bekah Hawrot-Weigel:Websites, are they still a good idea?RelatedMy event pageEvent page on fitc.caFull event photo album on Flic
1ヶ月前
Speaking at: Web Unleashed, 11 October 2024
Zach Leatherman
This is an event post. If you’d see the slides for this talk, you can do so at: The Best And Worst Parts Of Eleventy (Now In v3).
1ヶ月前
Eleventy v3.0.0 is now available!
Zach Leatherman
After over a year of work, our very first stable release of ESM-friendly 3.0 is now available: Eleventy v3.0.0 🎈🐀We are very excited to see this ship and look forward to what y’all build with it 🏆Eleventy v3.0.0: Possums ❤️ ESM (includes full release notes, features, upgrade guide, and thank you notes!)
2ヶ月前
Open Source Needs to be Financially Symbiotic
Zach Leatherman
I’ve been laid off twice in the past year and a half trying to navigate my professional career through the moderate success that has followed 11ty. I don’t feel as though I’ve been particularly successful at it, to be frank. What I have felt is largely expendable.I don’t blame any companies or individuals for those feelings—for me it’s representative of a larger problem with the incentives of open source software. This is further complicated by the influence of temporary and unsustainable ideas of “free” shaped by venture capital, but I digress.In seven years, the 11ty project has undergone various levels of funding:After-hours side-projectFull time employment-sponsored by one companyPart time sponsored by one companyIndependently full-time community-fundedEach of this had their benefits and drawbacks; each a unique reflection of the companies that I was coupled to at the time (and most importantly: the economic environment of the funding of these companies).BoundariesIndependent of fu
2ヶ月前
11ty is Joining Font Awesome
Zach Leatherman
Today—I’m delighted to announce that 11ty is joining the excellent team at Font Awesome!Read more on:Eleventy Blog: 11ty is joining Font AwesomeBlog Awesome: Eleventy Joins Font Awesome
2ヶ月前
heading-anchors Web Component
Zach Leatherman
<heading-anchors> adds sibling anchor links for heading elements (h1–h6) when they have an id attribute and positions those anchor links visually as though they were nested inside of the heading.DemoSource code on GitHubInspired by David Darnes’ component of the same name.Currently in use on v9 of the eleventy-base-blog project (and on this very web site, too).FeaturesUseful when you want preserve heading text as is (selectable, able to nest other links, etc).Useful when you want to exclude anchor links from your RSS feed.Links are positioned alongside heading text, but not nested inside of heading markup (for improved screen-reader compatibility and accessibility)Establishes a placeholder element to establish space for the anchor link and so that heading text doesn’t reflow during interactionPrefers the CSS Anchoring API (where available) but works using JavaScript positioning when the API is not available.Automatically matches font styling of the heading (font-family, line-height, fo
3ヶ月前
The Sneaky Costs of Scaling Serverless
Zach Leatherman
Up front disclosures: I am a former Netlify employee (it’s been over a year ago) and currently receive sponsored hosting services from both Vercel and Netlify.If I’m completely frank, the 11ty Screenshots API has been a bit of a maintenance annoyance over the years: it’s a beefy bundle and a bit of a resource hog. Historically Netlify has graciously provided hosting, but I’ve been getting increasingly uneasy about having all of my eggs in one hosting basket.So I decided to take the plunge and migrate it elsewhere, mostly to see what it would really cost. I learned a few things along the way (and made a few mistakes)—hopefully writing them up can help you save some money on your hosting bill, too.First stop, VercelThe 11ty Screenshots API uses headless Chromium and Puppeteer, provided via a community fork of Chromium to fit inside the various bundle file size limits of hosting providers (Netlify is 50 MB compressed, Vercel is 250 MB uncompressed).The deployment to Vercel was quick and e
3ヶ月前
Eleventy v3.0.0-beta.1 is now available!
Zach Leatherman
After over a year of work, our very first beta release of ESM-friendly 3.0 is now available: Eleventy v3.0.0-beta.1 🎈🐀We are very excited to see this ship and look forward to what y’all build with it 🏆Eleventy v3.0.0-beta.1: ESM like a Phoenix (the mythical bird, not Arizona) (includes full release notes, features, upgrade guide, and thank you notes!)
4ヶ月前
Improved error messaging for require(ESM) in Node.js
Zach Leatherman
The Eleventy code-base is now written using ESM.However, Eleventy projects can be written using CommonJS or ESM (and we’ll continue to support both moving forward).As Eleventy is a command line tool, this offers a bit of wiggle room navigating the CommonJS/ESM divide. That is, until we started bundling application plugins in the core library.Consider this application configuration file, making use of Eleventy’s Render Plugin.const { EleventyRenderPlugin } = require("@11ty/eleventy");If you try to import an ESM package in CommonJS, you’ll receive a pretty helpful error message:require() of ES Module ./node_modules/@11ty/eleventy/src/Eleventy.js from ./eleventy.config.js not supported. Instead change the require of Eleventy.js in ./eleventy.config.js to a dynamic import() which is available in all CommonJS modules.This error message is decent! But I think we can do better, and doing better will mean that folks will have an easier time upgrading to Eleventy v3. In order to add my own cust
4ヶ月前