HTML web components
Read NoteAn excellent look into the new trend of no-or-low-JavaScript web components, which almost operate more like HTML fragments, with graceful fallbacks to native elements. Jeremy proposes terming these …
theAdhocracy
An excellent look into the new trend of no-or-low-JavaScript web components, which almost operate more like HTML fragments, with graceful fallbacks to native elements. Jeremy proposes terming these …
Is the term "web component" useful? Or does it simultaneously obfuscate the power of the related APIs (custom elements, Shadow DOM, etc.) and confuse their intent/meaning in a way that leaves …
Max has put together one of the best examples of how container queries will fundamentally change the way front-end development works. Better still, they provide extremely clear explanations of …
The Component Kitchen is a sort of app store for web components; a digital directory of useful packages, recipes, and one-shots that can be imported into your …
An excellent overview of the current state of web components, including suggestions on how they could be …
An interesting – albeit flawed – attempt at a zero-dependencies, web standards focused, PWA based UI framework, and a potentially useful quick-start template for using web components and native …
Welcome to the third version of theAdhocracy! It's been a long time coming, but the site has finally been rebuilt, rehosted, and re-just-about-everything else, so I figured I'd actually formalise the launch with a new post explaining what's happened and why.
Static sites don't make search functionality easy, but luckily there are some excellent services that do. I've been messing around with Algolia and finally have it working with Craft and Gatsby the way I want it... on the backend, at least.
Notes from the fully remote React Summit 2020 (or at least the talks I tuned in for). Lots covered, from static-site generators and the Jamstack through to React state management and accessibility. What a fun day!
Notes from my second fully remote conference, this time Sparkbox's UnConference. Being able to freely access talks from the US is a rare bonus of everything going on right now, and this did not disappoint. Musical cameos, great talks on UX, accessibility, design systems, and amazing speakers. Great event (despite the time difference).
The search page is live, the index is populated, but it all looked a bit rubbish and it didn't quite work as well as I wanted. Now it's using custom-styled components, queries are tracked/stored via the URL for persistence, and you can filter results based on category.
Notes from the 2020 Jamstack Conf. Some interesting dives in the Jamstack community and various applications of Jamstack technologies, with tweet threads as usual.
Another month, another big and fully remote JavaScript conference. JSNation fit into my schedule a little less (and didn't quite overlap with my interests as neatly) but it was a fun event with some interesting talks on topics that are often only on my periphery. Much to think about!
What do you do when a website has loaded but the content is still being fetched from an API? One answer is to fill the page with animated placeholders, creating a skeleton of what the user can expect, with a dash of CSS animation to let them know that something's still going on behind the scenes.
Whilst accessibility means you largely want to steer clear of autofocus on web forms, sometimes it can be beneficial. In HTML, we can now reach for the handy autofocus attribute, but as I recently …
You have buttons on your website. These can be on a light background, or a dark background, and have active and non-active states, but should be highly visible in any variation. You might think that …
The combination of the Carbon design system and NextJS should make for rapid website development, but I ran into a few small hurdles getting them to play nicely with one another using existing documentation and community guidelines.
Building a tooltip? A carousel? A password input? I can strongly recommend checking if the Component Gallery has a page on whatever UI pattern you're working …
An excellent overview from Josh of the pitfalls of using UI frameworks. I particularly enjoyed their focus on why developers often advocate for these tools, and how those needs are often …
With half the year now firmly in the past, how are my 2022 goals coming along?
Apparently, ARIA live regions don't play nicely with React. Whilst they work fine in many browsers, they simply don't function in VoiceOver without some workarounds.
Understanding why non-interactive Storybook components are often announced as clickable by NVDA and other screenreaders.
A quick (and dirty) way to fetch local data from a JSON file and modify the look of a page in Astro, completely natively.
A very thorough overview of how to write a modern, performant, HTML-driven image component that is as optimised to serve the most appropriate image as possible. There are some very neat tricks in …
2023 was another BIG year in terms of, well, everything. We travelled all over the world. We attended scores of major events. And we got married. It's taken a while to write up, as a result!
A very well written overview of when client-side functionality and server-side functionality make sense to use for a …
Storybook encourages setting the same arguments over and over and over again, but this is a pain to maintain. There is a better, DRYer approach, it's just not well documented.