zl-fetch, a simplified fetch

Zell Liew has written a simplified wrapper around fetch, named zl-fetch, that looks promising. From the current v4.0.0 onwards, zl-fetch is a ESM library. It …

List of ECMAScript 6 features

A list of lists: Luke Hoban (+27 contributors) compiled a comprehensive list of the features new with ES6 on GitHub. Another list, which puts ES6 …

Coder Ipsum

Lorem Ipsum for coders: Coder Ipsum. It´s made by Sia Karamelegos and she says about the tool: Thought-leadership synergistic programming filler text for your next …

monitorEvents and monitor

monitorEvents # monitorEvents() allows to observe events from the web browser console for Safari, Chrome and Edge. Firefox doesn´t support it. Events will be logged …

Git Cheat Sheet

@hasanstack came up with a Git Cheat Sheet. I like the command flow overview. Git Cheat Sheet by @hasanstack: Download.

Stack Overflow Developer Survey

This week a colleague shared the Stack Overflow Developer Survey 2022. Admittedly, I wasn´t aware they have such a thing. It´s interesting to read through …

tabindex

WebAIM Tabindex contains an excellent description of how to use the HTML tabindex attribute. The attribute can have three distinct uses: tabindex="1" (or any integer …

eleventy-embed-tweet

Kyle Mitofsky wrote the eleventy-embed-tweet plugin to fetch tweets during build time, optionally cache the tweets on the file system, and render them by accessing …

:has()

Jen Simmons wrote an excellent article about the new :has() CSS selector on webkit.org, titled Using :has() as a CSS Parent Selector and much more. …

JetBrains Mono

JetBrains Mono is my coding font and it has been for years. It´s easy enough to configure VSCode to use the font. What I noticed …

MathJax on the server with Markdown

Eric Meyer[1] made me aware of MathJax. On their site you find the claim: A JavaScript display engine for mathematics that works in all browsers. …

Mozilla SSL Configuration Generator

That´s quite useful. A generator from Mozilla to create proper SSL configuration files for various http servers (Apache, nginx, Tomcat, …). Visit ssl-config.mozilla.org.

How we think about browsers

The GitHub engineering article How we think about browsers shows their progressive enhancement attitude. My takes: Make fast sites: At GitHub, we believe it’s not …

Meet Web Push for Safari

From the Apple intro: Bring better notifications to your websites and web apps in Safari on macOS with Web Push. We’ll show you how you …

SVGOMG

To optimize SVG´s easily, Jake Archibald made SVGOMG to be The missing GUI of SVGO In the demo of SVGOMG you can see an 8.54k …

HTML with Superpowers

It has to have a hyphen in it. Dave Rupert Excellent slide deck by Dave Rupert about Web Components. Find the deck on Notist. Within …

Checkbox webcam filter

Bryan Braun created a webcam filter out of HTML checkboxes. Try by yourself at webcam-test. It´s part of his checkboxland."Checkboxland is a JavaScript library for …

Flexbox sizing mental model

The following explanation from Anna Monus is taken out of A Comprehensive Guide to Flexbox Sizing and I find Anna´s text most helpful. Anna has …

Remove unwanted scrollbars

Detect CSS Overflow Elements is a tiny hack by David Walsh to detect the root cause of unwanted scrollbars on a web page. Use the …

Remove git history

Make the current working directory into the only commit and remove the complete git history. Found on stackoverflow. git checkout --orphan newBranchgit add -A # …

Edit on GitHub for an 11ty powered website

Adding a link to edit the contents of any page for an 11ty powered website on GitHub is simpler than I thought.[1] Example: <a href="https://github.com/ulfschneider/11ty.ulf.codes/edit/master/./content/posts/2021-04-27-edit-on-github-11ty.md">Edit …

GitHub Learning Lab

The GitHub Learning Lab provides online training courses for free about DevOps, GitHub Actions, Languages and Tools, and GitHub 😃.

Resilient Web Design

Resilient Web Design by Jeremy Keith Resilient Web Design by Jeremy Keith is a pleasure to read. Jeremy has put together context and concept for …

Split a figure

A responsive technique of splitting a figure equally into an image (one half of the available space), and the corresponding caption (other half of the available space).

Using Trello as a Super Simple CMS

In his CSS-Tricks article, Phil describes a very nice and generic approach to use 11ty data files for fetching contents from Trello. Phil doesn´t talk …

Learn eleventy from scratch

Learn Eleventy From Scratch is a training made by Andy Bell. It´s a practical, well organized, and well written course that allows you to get …

Going Offline (book)

Going Offline by Jeremy Keith Going Offline is following the same agenda as Jeremy does in his talk. Of course, the book provides more background …

Going Offline (video)

With Going offline, Jeremy Keith is giving an excellent talk about how to turn a website into a Progressive Web App (PWA). A PWA is …