Front-end
A collection of articles covering Front-end
ArticleMay 27, 2025
My experience AI vibe coding a complete web application from scratchDiscover how I built a complete breathing exercise web app without touching a single line of code, using AI to transform an idea into a fully functional product. What was good, what was bad and is this where we are heading in our industry?
ArticleAugust 16, 2024
View Transitions for Multi-page AppsWe finally have (experimental) View Transitions for Multi-page Apps (MPA)! Let’s explore why this is cool and how we can use it.
ArticleMay 15, 2024
On-the-Fly Machine Learning in the Browser with TensorFlow.jsTensorFlow.js is an incredibly powerful JavaScript library for training and deploying machine learning models in the browser and Node. js. Let’s explore this library by building a teachable machine!
ArticleMarch 8, 2024
Progressively Enhance Handling Your Forms With React.js Server ActionsA large part of adding interactivity to your applications is through forms. Single Page Applications SPAs have not always handled this part the best. Let’s have a look at how we can use React.js Server Actions to handle your forms progressively enhanced.
ArticleNovember 16, 2023
Reducing latency in AI Speech SynthesisAI-powered speech synthesis is getting incredibly realistic. This opens up many possibilities to generate realistic audio based on the text you provide. Whilst relatively fast, the latency still isn’t low enough for “real-time synthesis”. Let’s optimise that!
ArticleNovember 2, 2023
Interacting with ChatGPT through Voice UI on the webHow can I improve the way someone interacts with ChatGPT? How can I make it feel more natural than a dreadful “chatbot”? Can I create something cool? Those were some of the questions I asked myself recently while starting a two-day hackathon at iO. I’ll take you through what I build, how, and most importantly, why.
ArticleAugust 1, 2023
Finite State Machines in JavaScriptApplication state can make any application complex real quick. Let’s have a look at Finite State Machines in Javascript to resolve some of these complexities.
ArticleApril 11, 2023
The File System Access API: Unlocking New Possibilities for Web DevelopersThe View Transitions API has landed in Chrome. Let’s have a look at how the API works and why it will change the feel of the web.
Quick BitDecember 19, 2022
The unexpected behaviour of rem units in media queriesConfused about why your rem units aren't behaving in media queries? Find out the reason behind this unexpected behaviour and learn more about using rem units in responsive design in this article.
ArticleDecember 7, 2022
Unleash the Power of Web Workers for Blazing Fast JavaScript ExecutionWeb Workers are a valuable tool for JavaScript developers, allowing for concurrent execution of code and improved performance and user experience. In this blog post, we explore the benefits of Web Workers and provide a practical use case with code examples.
ArticleNovember 15, 2022
You need CSS Cascade LayersLet’s have a look at how you can better structure your CSS layers with CSS Cascade Layers!
ArticleOctober 20, 2022
Developers are not Trusted Types!Even with our best intentions as developers, we all make mistakes. XSS being one of the most common web vulnerabilities on the web proves that we need to better defend ourselves and our users against this. Let’s see how Trusted Types can help us!Quick BitSeptember 16, 2022
How to use matchMedia to create a performant custom viewport hookUnfortunately, sometimes you need to write viewport-based logic in your JavaScript code. Usually, this is done with a listener on the window for a resize. Let’s look at a better way.
ArticleSeptember 7, 2022
How do I setup CI/CD & hosting?How to build a component library Part 4: Setting up CI/CD & hosting.
ArticleAugust 31, 2022
How do I set up linting, unit, snapshot and visual regression testing?How to build a component library Part 3: Setting up linting, unit, snapshot and visual regression testing.
ArticleAugust 24, 2022
How do I pick a front-end framework & showcase it with Storybook?How to build a component library Part 2: Picking a front-end framework and setting up Storybook.
ArticleAugust 17, 2022
How do I set up a Monorepo, SemVer strategy and Private package registry?How to build a component library Part 1: Setting up a Monorepo, Semver strategy and Private package registry.
ArticleJune 29, 2022
Smart cropping with native browser Face DetectionMany online services will help you with cropping an image while keeping face(s) in view. We can however do this just using an (experimental) browser native API. Let’s build it!
ArticleJune 8, 2022
The infinite legacy cycle in front-endProjects often become legacy in an incredibly short time. I have spoken to people in technology with a variety of skills, experience and roles. Time to find out how they think about this, what tips they have to prevent these issues and more.
Quick BitJune 1, 2022
Keeping dependencies in sync in your mono-repoWhen building a component library as a mono-repo, you need to keep internal and external dependencies up-to-date between packages. You could do this manually once in a while, but there is a better way. Let’s have a look at Manypkg!
Quick BitNovember 18, 2021
Full page scroll snapping with CSS onlyScroll snapping is a popular technique to focus on a single piece of information. How can we implement this without the need and complexity of Javascript-based solutions?
ArticleFebruary 17, 2021
Design handoff in the browserI strongly believe in the concept of leveraging design handoff in the browser. I noticed many benefits for me as a front-end developer and the designers I work with using this approach. In this blog post, you will find out why you should design in the browser, how it works and how to start