My personal blog on the web
It's a secret to everyone! This post is for RSS subscribers only. Read more about RSS Club # # Personal stuff # ## The road to 7a (bouldering) I really want to nail the 7a this year. Turns out, my bouldering gym offers personal training. 3 sessions of an hour. After 2 sessions, I am even more excited. It sure is more difficult to climb when you have to think about what you do, but I feel I am…
It seems that the capabilities of CSS grow exponentially fast the last few years. With the iterop initiative making sure that features are consistent across browsers, life as a Front-end Dev is quite awesome. Usually when I want to play with all these new toys, I look at Can I Use to see if I can actually use them. But now that we are starting to build a complete design system from scratch, I want…
We just hit 1500km on our cargo bike. After our car broke down in the summer of 2022 we decided to not replace it. Instead we got an electric cargo bike and a subscription for a car share service. It still felt like a challenge with two kids (2 and 5 years old at the time). After just two months since we got the cargo bike, we reached the first 1000km (December 24 2022). Today we reached 1500km. T…
It's a secret to everyone! This post is for RSS subscribers only. Read more about RSS Club Maybe a summary of the previous month is a good way to get in the habit of blogging more? Lets find out… # # Personal stuff # ## The road to a 7a (bouldering) I don’t make new year resolutions. I am notoriously bad in keeping those kind of promises to myself. But this year I did set a goal for myself. Taking…
It's a secret to everyone! This post is for RSS subscribers only. Read more about RSS Club I love the web. The openness, the expressiveness. The way it lets me fiddle with code and make things come alive. After the Twitter collapse I joined Mastodon, and the whole front-end community with me (or so it seems). With that I regaind an appreciation for blogs and RSS. So when I found out about this, I…
I learned a thing or two about cookies today… It took me quite a while to figure it out, but I think I understand it now. I am rebuilding a website from an old PHP / Twig setup into something more modern. The PHP backend is still in use, but I wanted to separate the front-end and rebuild that with Remix. The backend gets slowly transferred into an API only backend that my Remix server is going to…
Update about the used example in this post Today (17th of June 2021) I stumbled upon a CSS Tricks article which states that you CAN detect if a user has their colours inverted system wide. Kicking over the whole foundation of the examples I provide in this post. The original problem that I had is thus solved (use the @media (inverted-colors) media query). If you still want to read the original…
Recently I added webmentions to this blog. Which is completely static. It is build with Eleventy , and hosted on Netlify . Accepting Webmentions in the first place Accepting webmentions for a static site is relatively straight forward. I followed the article An In-Depth Tutorial of Webmentions + Eleventy to do so. And was quite happy with the results. But there are a few things I did not liked…
When you build a UI for a product (app, website, anything else), it is intended to be used by people. People come in all shapes, sizes and abilities. I used to think that making an UI accessible is something you should aim for. It was morally the right thing to do. Recently I started out to become better at making my work better accessible by doing research into people that use assistive…
For a couple of years now, I have been working with front-end frameworks almost exclusively. At De Voorhoede , we adopted the componentised way of working early on. We moved from binding JavaScript to the DOM via data-* attributes on to using Angular.JS and from there to React and Vue. Each step of the way felt like a great step forwards. The concept of components spoke to me because I could focus…
Today I submitted the PR to sign the Overlay Fact Sheet . I did not do this lightly. In this post, I explain why I did. What the factsheet is all about To quote the conclusion of the Overlay Factsheet: Accessibility on the Web is a big challenge, both for owners of websites and for the users of those websites. The invention of novel approaches to resolving this challenge is to be commended.…
New CSS selectors in Web Components One of the most useful features of the Shadow DOM specification, is scoped CSS . The styles defined in the Shadow DOM don’t leak out to the containing page. But within the Shadow DOM you CAN get a sense of the surrounding context of the Custom Element. To make the latter possible, some new selectors have been introduced. In this post, I will explain how I…
The problem After my previous blog post , I ended up in a discussion with @harmenjanssen in which he made the following point: Most components will need Javascript to function, *after* needing Javascript to render, is what I mean. So using SSR to implement the JS *rendering* would leave the user in a sort of semi-enhanced experience? At least I need some examples that show otherwise. —…
What is the Shadow Dom and why is it important? The Shadow Dom is a specification that CanIUse summarises as: Method of establishing and maintaining functional boundaries between DOM trees and how these trees interact with each other within a document, thus enabling better functional encapsulation within the DOM & CSS. - CanIUse.com An element can have its own DOM which is hidden or inaccessible…
About this serie of posts This is the start of my journey to render Web Components on the server. In it I will document the things I run in to. Things that work out. Things that do not work out. I see a great deal of potential in the adoption of web components because I believe that working with ‘vanilla’ web technologies will be more resilient, more stable, and better maintainable. Especially in…
My journey to become a better front-end developer For a long time now I try to keep up with all the latest developments in our front-end community. Learning React, a bit of Vue, diving into ES6,7,… You know, like the rest of us. Learning about all these frameworks, build tools and the like, I get the feeling of missing out on a more important part of our trade. Because the ultimate goal we all…