Schalk Neethling - Open Web, Open Source, and Web Accessibility

A practical walkthrough for when you realise your feature branch was created from the wrong base, covering git log, merge parents, cherry-pick, and bypassing commit hooks.

Manage anchor relationships with anchor-scope, leverage the Popover API's implicit anchors, and hide positioned elements gracefully with position-visibility.

A deep dive into the JavaScript concepts behind mocking HTMLImageElement behaviour in Vitest, including Object.defineProperty, Object.getOwnPropertyDescriptor, prototype manipulation, and WeakMap for per-instance state tracking.

How to structure an AI agent session with sequential tasks, review checkpoints, and explicit deliverables—turning a handoff document into actionable state machines, gap reports, and implementation plans.

How to structure a self-contained folder of specifications, screenshots, and Figma links that an AI agent can reference throughout an implementation planning session.

How to structure a handoff document that enables AI agents to perform gap analysis and implementation planning—with traceable acceptance criteria, UI state inventories, and explicit business logic.

Learn how to safely select DOM elements with special characters in their IDs or classes using CSS.escape() to avoid selector parsing errors.

Learn how to programmatically require the presence of a modifier key to enable scroll wheel zoom support in Leaflet maps.

How to use TypeScript’s triple-slash reference directives to load type definitions when type-checking JavaScript with JSDoc.

Learn how to use Node.js util.parseArgs() to simplify command-line argument parsing in your Node.js CLI utilities.

How to use deferred promises to control mock response timing in Playwright tests and avoid race conditions with instant responses.

AI coding agents have made me significantly more productive as an engineer, but they have a systematic problem: as context fills, they drift from explicit guidance and violate documented patterns.

Combining Zod's runtime validation with JSDoc's type annotations to achieve type safety in JavaScript without TypeScript.

Export your Algolia search indices to JSON without building custom export scripts using the Algolia CLI.

Build resilient anchor-positioned layouts that adapt when space runs out.

What I learned reviewing AI-generated JavaScript: real-world issues, code review tips, and ways to ensure robust, production-ready code.

Learn how to use the new CSS ::details-content pseudo-element to style the content area of HTML details elements with greater control and flexibility.

Exploring common misconceptions AI agents have about Visual Regression Testing and practical solutions to address them.

Take your anchor positioning beyond the grid with functions that give you pixel-level control over placement and sizing.

Discover how CSS anchor positioning brings native support for positioning elements relative to each other — no JavaScript required.

Learn how to use HTML invoker commands to open and close dialogs without writing any JavaScript.

What if we embraced authenticity, take creative risks, and live deliberately without fear of judgment - a reflection on finding freedom through self-acceptance in both personal and technical pursuits.

A deep dive into the CSS transform matrix, how it relates to the individual CSS transform properties, a look at the hidden powers of the function forms, and a dragon or two.

In this part, we will add a form to our profile page, use a dialog to display our form, deploy our page using Netlify, and set up Netlify to handle form submissions.

Harness the power of open source and an innovative culture to drive creativity and collaboration within your team—inspired by Mozilla, GitHub, OddBird, Igalia, and Factorial.

In part five of the series, we will complete our layout, add a favicon, and set up Open Graph meta tags for social sharing.

Learn about WCAG (Web Content Accessibility Guidelines), including WCAG 2.2 principles, conformance levels, and upcoming WCAG 3 changes, plus insights on accessibility certification value.

Learn how to use the HTML dialog element to create accessible modal dialogs for your web sites and applications.

Join me on my journey as I prepare for the IAAP Web Accessibility Specialist (WAS) certification, sharing weekly insights, resources, and study plans.

In part four of the series, we will do some refactoring of our CSS so that we take advantage of CSS custom properties.

Learn how to build a responsive profile page with modern typography, media queries, and CSS Grid.

Learn how to build a responsive profile page with modern typography, media queries, and CSS Grid.

The financial pressures of modern life can make it hard to justify creative pursuits that don't promise immediate returns.

In this post we will start implementing the design by working through some of the issues, learning more about Git and GitHub, get set up for development, create our first visual component, and learn about performance, CSS, and modern image formats.

In this part of the series we will break down the design into components using Atomic Design, set up our repository on GitHub, and create the issues we will need to work on.

Meet Project Calavera, a new open-source CLI tool that makes project configuration setup a breeze, especially for developers working outside the familiar framework ecosystems.

Learn how to use npm link to test your NPM packages locally before publishing to the registry.

This personal reflection explores how AI chatbots can support emotional growth and self-discovery, offering insights on using AI as a thoughtful companion while acknowledging its limitations compared to human connection and professional therapy.

Introducing Minimalist, a modern, lightweight, and customizable CSS library designed to provide a solid foundation for styling websites and web applications.

Unlock simpler web development with CSS's new individual transform properties—cleaner syntax, more intuitive styling, and delightful animations.

Learn how explicit return types in TypeScript can help you catch potential bugs early, improve code reliability, and create more predictable and maintainable TypeScript applications.

My takeaways from Zach Leatherman's talk on web components at the 2023 JSHeroes conference.

Why you should be careful copying and pasting proposed solutions from LLMs.

Perhaps it is the social bubble I find myself in, but it seems there is a lot of talk about gatekeeping happening at the moment.

Git rebase is a powerful tool that allows developers to reorganize and clean up their commit history, such as by squashing or fixup-ing multiple commits into a single commit, which can be useful when submitting pull requests.

In late December of 2023, TPGi posted its list of the top accessibility errors found through its ARC automation tools in 2023.

While this post does not by any means aim to cover all the amazing things you can do with Intl.NumberFormat, I do cover two very common use cases you may have faced when formatting numbers in JavaScript.

In this post, I share 21 pieces of unsolicited advice for junior web developers.

In this post, I discuss why I care deeply about web accessibility, emphasizing its importance in ensuring equal access for people with disabilities and removing barriers to interaction with websites and applications.

In this post I share how open source empowers me as a developer, fosters community collaboration, and provides a platform for making a meaningful impact.