A Shower Of Thoughts / Bernardo Baquero Stand

My 2017's Lists and Numbers

2017-12-31T00:00:00Z

At the end of the year, I like putting lists together and reviewing numbers for the things I managed to keep track of during the year. This is a fun way for me to look back at 2017 through the things I enjoy the most — music, films, concerts, traveling, and games!

Traveling #

In 2017 I visited to 10 cities in 7 contries. To get to these cities and back, I traveled twice by train, 6 times by car, and 7 times by plane.

Brussels, Belgium
Liege, Belgium
Luxembourg, Luxembourg
Cologne, Germany
Dubrovnik, Croatia
New York City, USA
Chicago, USA
Iowa City, USA
Paris, France
Bogotá, Colombia

This year I finally visited New York City, which is, next to Tokyo, among the cities I've always wanted to visit the most. It was definitely the traveling highlight of the year for me.

Concerts #

I attended 10 live shows, for 9 different artists, across 5 different cities in 3 countries.

Dream Theater — Tilburg
Between The Buried And Me — Amsterdam
Devin Townsend — Amsterdam
Haken — Amsterdam
Fatboy Slim — Amsterdam
Snarky Puppy — Eindhoven
The Shattered Fortress — Tilburg
La Yegros — Luxembourg
LCD Soundsystem — Amsterdam
Dream Theater — New York City

Dream Theater were the first and last live shows I attended during the year. Neat!

Music #

I used Spotify almost exclusively to listen to music during 2017.

I listened for a total of 29699 minutes of music during the whole year, which is the same as 495 hours, or 20.6 days. I honestly feel surprised it was this little.

The artist I listened to the most was The Dear Hunter.

The song I listened to the most was People Who Eat Darkness by Steven Wilson.

Overall, my favourite album of the year was To The Bone by Steven Wilson, followed by Arcade Fire's Everything Now.

Films #

According to my Film Diary in Letterboxd, which I tried to keep accurate through the whole year, I watched 57 films in 2017.

Out of those, 32 of them I watched at home, 15 on the cinema, and 9 while travelling (of which 4 were while on a plane).

Out of those, Blade Runner 2049 was my favourite film of the year, with Coco being a close second.

23 of these films I watched on Netflix.

I feel like I didn't watch as many films as I would have liked, so that's something I'll try to improve on next year. This year I also signed-up for Amazon Prime Video, so I hope it makes for more films to watch during next year.

Games #

This year I played 31 games, and finished 13 of those.

22 of them were on PS4, 3 on Switch, 4 on Nintendo 2DS, 1 on SNES (Classic Mini), 1 on iOS, and 1 with emulation.

1 of them was a replay.

Finished: #

Titan Souls — PS4
Final Fantasy XV — PS4
Journey — PS4
FF XV: A King's Tale — PS4
Inside — PS4
Kingdom Hearts 1.5 Final Mix — PS4
Kingdom Hearts 2.0 Final Mix — PS4
Monument Valley 2 — iOS
Unravel — PS4
Life Is Strange — PS4
Mario Kart 7 — Nintendo 2DS
Super Mario 3D Land — Nintendo 2DS
Super Mario Odyssey — Switch

Played #

Doom — PS4
Yakuza 0 — PS4
Final Fantasy XII: The Zodiac Age — PS4
Tearaway: Unfolded — PS4
Abzú — PS4
Super Mario Bros. 3 — NES Emulation
Yoshi's Island: Super Mario World 2 — SNES Classic Mini
Kingdom Hearts: Birth By Sleep — PS4
Guacamelee — PS4, replay
Hyper Light Drifter — PS4
Sonic Mania — PS4
The Legend of Zelda: A Link Between Worlds — Nintendo 2DS
Mario And Luigi: Superstar Saga — Nintendo 2DS
Rocket League — PS4 + Switch
Downwell — PS4
Street Fighter V — PS4
Tricky Towers — PS4
Mario Kart 8 DX — Switch

Rocket League is easily the one game I played the most during the year.

And without a doubt Super Mario Odyssey is my favourite game of the year.

Highlights of 2017 #

Visiting the US was something I always wanted to do, and this year I finally got the chance to do it for the first time. It was a great experience altogether, specially NYC!
In preparation for visiting Japan (hopefully next year!) I started learning Japanese!
In Dubrovnik, I rode a water motor ski for the first time — it was pretty exciting. Also, stressful.
At work, I was promoted to Technical Lead for my Frontend development team.
The biggest one was getting engaged with my girlfriend Andrea. I proposed to her in the middle of the Brooklyn Bridge in New York - a culmination of personal goals coming together right there and then.

Reeddit, 6 Years Old

2018-11-20T00:00:00Z

6 years ago today, I gathered the courage to put Reeddit out there. To share it with other people. It was my first serious attempt at building a complete, frontend-only web-app.

Reeddit is basically an alternative way to browse reddit.com’s content. While I love to read and browse reddit.com, I never really liked their UI- specially on their mobile site, which was really cumbersome and ugly, at least back then.

Also, I wanted to become a proper web frontend developer! I had worked with Java for almost 4 years by then and sure, I had to work with HTML and CSS over the years, but it always felt like I was only scratching the surface, and JavaScript had always completely eluded me.

So this was, in my mind, the perfect way to address those things: I would design and build the reddit UI that I’d love to use, and by doing so, I would learn as much as I could about what frontend development really was, learn the proper foundation— JS included.

In the span of ~5 months, working a couple of hours every week after work and a bit more each weekend, I built a responsive, single-page web-app for just reading reddit. And by doing so, I had learnt so, so much about building things for the browser; how to tame the DOM (thanks to jQuery/Zepto!) and the Cascade, the Box Model, how to use Flexbox (so shiny and new back then!). And I had more or less built the alternative reddit client that I wanted.

But that was supposed to be it! I built it for me. So I could use it myself. I didn't consider publishing it on the web— not initially.

But after showing what I had done so far to a friend from work, he told me "you should put it out there! It's nice!", to which I said that wasn't in my plans because I didn't think it was good enough for people to use it and much less like it. And then he said "if you already find it useful or good for yourself, there will be others who will agree and use it as well".

And that made me realize: if there was a single person who finds Reeddit, uses it, likes it, and continues using it, that'd be a huge satisfaction for me. Enough of a reward.

So for a couple of days I worked on making Reeddit a bit more "presentable", and made sure it worked fine in all the browsers I had installed, which were desktop and mobile Safari, Chrome, Opera, and Firefox.

And finally, on November 20th, 2012, I shared it with the world; first with my Twitter and Facebook network (announcement tweet), and then on reddit itself (thread on r/webdev).

I considered also showing it to Hacker News, but decided not to because I thought it was definitely not HN-worthy and that it would be shat upon if I did share it there. So I didn't. Silly me.

The reception on twitter and reddit was pretty much what I expected and hoped; people gave me good feedback, suggestions, and compliments. It was great. It felt good to share what I had worked on and to see it being well-received. I figured the cycle was complete. That the project was over as it had served its original purpose.

But it was far from over.

Less than 2 months later, during the first week of January 2013, someone :) shared Reeddit on Hacker News, and I only found out about it because after waking up that morning, I saw I was getting a lot notifications from people making tweets about Reeddit! All because of the weird machine that is Hacker News top posts.

So, I learned that there's a bunch of twitter bots that automatically tweet when a HN post receives certain amount of votes; here's reeddit getting 50 votes and here's reeddit getting 100 votes. And I guess people that follows these bots started reacting to those tweets and checking and tweeting about Reeddit. Then HN's post reached the top 2 spot on the frontpage.

And then it quickly reached the top of HackerNews' frontpage. Gulp.

The buzz generated by HN and Twitter was picked up by some big websites:

Designmodo tweeted about Reeddit.
Venture Beat published an article and tweeted about Reeddit.
Mashable published a video article about Reddit — although the actual video doesn't seem to work anymore. Boo.

And best of all, Alexis Ohanian himself tweeted about Reeddit.

It was crazy.

Those were a very awesome couple of days. It made the whole thing so incredibly rewarding. Much more than it already was.

But it was not over.

Even after the online buzz faded out, I learned of another benefit from it; I started getting approached by a few companies that were interested on me joining them as a frontend developer. One of them was a big one, and I couldn't believe it. And even though none of those worked out –as I would have had to move to a city I didn't really want to– the fact there was interest in my profile as frontend developer gave me the confidence to persue that path completely, and apply for Frontend Dev jobs in Amsterdam, which is what I really wanted.

Very fittingly, while using Reeddit myself one day and browsing the Amsterdam subreddit, I stumbled upon a post from someone sharing a job opening in the city, to which I replied with interest. Long (sub)story short, it was the experience and knowledge that I got from building Reeddit, and the confidence that its reception got gave me, what ultimately resulted and me getting a great job and moving to Amsterdam.

Afterwards, I continuously used Reeddit as my code playground, trying new things while fixing its bugs or adding new features, experimenting with new frameworks or libraries, or just applying the new things I'd learned at work. I believe I learned Sass/SCSS by migrating Reeddit's styles to it.

Reeddit has also received some open-source contributions during these years, which has always made so happy, humble, and very thankful, and has inspired me to give back— even though I don't do it as much as I should.

But it's been a while since I've done any work on Reeddit. I still love the product, but I feel like I've moved on from the codebase.

For almost 2 years now, I haven't really improved Reeddit. It got an improvement some weeks ago via a Pull Request on GitHub (yay open source!) but that's been pretty much it since years.

And it's actually a great feeling to see something you haven't had to support for a long time is still working fine. Of course, that's partially also thanks to Reddit itself not breaking its public API and to a very stable GitHub Pages service. But it's ultimately a testament to how wonderful The Web as a platform really is. How things that haven't been touched for years are still perfectly usable and accessible. I love it and don't take it for granted.

And I will try to make sure that my now-6-year-old Reeddit web-app stays usable and accessible in the future; but it's time to officially feature-freeze Reeddit.

It's time to move on.

To Reeddit 2.

Footnotes:

The first improvement to Reeddit after releasing it was done just around 30 minutes after sharing it on reddit and getting the suggestion to show previews for image posts, in the comments view.
For some time at the beginning of the published codebase, all the JS code was wrapped in a single jQuery/Zepto $.ready() function.
Firefox had no support for Flexbox back then, so I had to do some sort of browser detection and use Floats instead. Yikes.
Reeddit's UI was inspired by HNMobile, now known as HackerWeb, by @cheeaun. When I used HNMobile for the first time on my iPhone 4S, I remember being blown away by the fact a web-app could look and feel so smooth and native.
Yes, I'm building a new version of Reeddit!

My List and Numbers of 2018

2018-12-31T00:00:00Z

Same as the previous years, here’s a bunch of lists and numbers from the things I did in 2018.

While writing this, I’ve realised that looking back at my own Twitter feed is a perfect way to recollect lots of the my year’s highlights. And here I was thinking of using Twitter less, heh.

Places #

I visited 5 cities in 4 countries. To get there and back, I traveled by train twice, and flew ten times.

London, England. First time visiting. It’s uttely massive, so I felt like I didn’t have the chance to see enough of it. What I did see was great.
Berlin, Germany.
Barcelona, Spain. Twice!
Cartagena and
Bogotá, Colombia. The food! <3.

Concerts #

Steven Wilson @ AFAS, Amsterdam
Hamilton @ Victorian Palace Theater, London. This is one of this year’s highlights. It was an incredible experience that I’d love to revisit.
Arcade Fire @ AHOY, Rotterdam
Motherwolf @ Melkweg, Amsterdam
CHVRCHES @ Tivoli, Utrecht
Nightwish @ Ziggo Dome, Amsterdam

Films #

I love films. Going to the movies, watching films at home. Reading about them. Learning from them. This year, I decided to get a Cinevillepass, which basically allows me to watch films unlimitedly across 50+ movie theaters in The Netherlands for a monthly subscription. It’s awesome, and it really made me go out to the movies more. I watched 25 films using the Cineville pass.

I also became a Pro member of Letterboxd, mostly to support the website and its service, as it has become my favourite place to geek out about films. And as it turns out, Pro members get a nice Stats page per year. Here’s my 2018 Stats for Films:

In total, I watched 78 films — 63 of those were films I hadn’t watched before, and the remaining 15 were rewatches. It amounted to 149 hours of movie-watching, or a bit more than 6 days.
I watched 5 of these films during a flight.
28 of these films I watched on Netflix.
My favourite film of the 2018 is Spider-Man: Into The Spider-Verse. I was anticipating it since I watched the first teaser halfway through the year and it absolutely blew my already-high expectations. It’s perfect.
- My runner up is Roma; as a fan of Alfonso Cuarón, this feels like his magnum opus. A technical masterpiece.

Games #

This year I stumbled upon IGDB.com, which is trying to be a mix of IMDb + Letterboxd but for gaming. I decided to use it as a way to keep track of my games.

Here’s the list of all the games I played and the games I finished in 2018.

From the moment I finished it, I had no doubt; my favourite game of 2018 is God Of War.

My favourite games of the 2018 are:

Music #

I feel like I listened to so much music, so many different stuff that it’s a bit tricky to recollect. These is what pops out as I write this, as my favourite music this year:

At this point, Love Is Dead is tied with The Now Now for my favourite album of 2018.

Work #

This year I left my job of 4.4 years, and the first one I got in The Netherlands, to join a promising and exciting scale-up to continue working and growing as a Frontend Developer in Tiqets. I decided to work 36 hours (so a day off every 2 weeks) and it’s being a bliss and I’ve learned a lot. Here’s to more of that for 2019!

I also started development of and announced Reeddit 2. Hope to release it in early 2019.

Other #

I walked on ice! When the canals in Amsterdam froze early in the year, we got to walk on them. It was incredible, and scary!
I bought a new Telecaster guitar which pushed me to get better at guitar playing and inspired me to learn more about music theory, specially. Hopefully I’ll make it something out of it in 2019.
I visited Efteling, which is like a Dutch version of Disneyland, sort of. Was wonderful.

Here’s to an even better 2019.

New song from Tool

2019-08-07T00:00:00Z

After 13 years (!), Tool has released a new song, "Fear Inoculum".

This is surreal on its own; for a long time it felt like there was just not going to be new Tool music ever. But the best part is that it's only one song from their soon-to-be-released new album. Incredible.

I've listened to the new song a bunch of times today. I'm so excited, I'm just going to put my unordered thoughts around this in a list:

In Apple Music, this track is listed as the 1st one of the new album's tracklist, with the rest just named Track 2, Track 3, etc. since their titles have not been revealed yet.
This might just be an Apple Music quirk, but it could also mean this is the album opener.
If this is the album opener, it would mark the first time in Tool's discography that the opener is also the titular song.
The song itself is just fantastic! It sounds exotic, introspective, and then intense and cathartic. Very progressive.
The first half reminds me a lot of Disposition and Reflection. And Disposition is one of my favourite Tool songs.
Actually, there's a section where I thought I was listening to Reflection, because of the drum patterns. Possibly a callback!
Maynard's singing is phenomenal. Very emotional and dynamic performance.
One of my favourite things about Tool is their song endings; they're so bombastic, full of energy. And here they've done it again. Powerful ending.
It's so, so good to listen to Danny Carey's fantastic new rythms and unreal drumming. He's in such great form here.
I had no idea they were releasing a single before the new album's release. This caught me by suprise this morning!
The excitement and anticipation for the new album has grown immensely after today!

Firefox Add-Ons that should be built into the browser already!

2019-08-23T00:00:00Z

One of the many great things about The Web and web browsers is the inherent ability of users to extend the browser's abilities and functionalities via extensions/add-ons, which ultimately improve our experience and agency on the web and empower us as its users.

Popular browser extensions can often end up becoming native browser features; e.g, Firebug, one of the most important and influential Add-ons in Firefox for web development, has been integrated into Firefox natively (in its Developer Tools).

Through the Test Pilot program, Mozilla created a bunch of Add-ons with the aim of eventually taking the learnings and best results and build them into a better Firefox. Even though Test Pilot is now over, it gave us some truly fantastic functionality in Firefox via these Add-ons.

I really like some of those Add-ons, so I wanted to talk about them because I believe you would find them useful as well.

The thuth is the majority of regular users will not dive deep enough into the browser's capabilities in order to take advantage of Add-ons in general. That's why I think these following Add-ons should be baked into Firefox by default already, so everyone can easily start using them from the get go.

While we wait for that, they are available to us right now, of course. So take a look and improve your browsing:

Containers #

I see Containers as sort of an evolution of "Private / Incognito" mode. When you open a Private/Incognito tab, whatever you do in there stays isolated from your normal browsing, and when you close the Private tab, any storage set by any site you visited gets deleted.

Containers work similarly- any Container tab's activity stays isolated from your normal browsing or from any other Container profiles. But unlike Private tabs, Container tabs don't delete the sites data when you close them. This is a good thing, because it allows you to easily maintain different online profiles in the same browser.

Snooze Tabs #

I like to treat tabs as a sort of "to do" item; read this, watch that, listen to this, try that. And once I'm done with that "task", I can just close the tab.
So naturally, I've never liked having endless amounts of tabs opened while I work, as it feels overwhelming and distracting- "so many things to do!".

This is why Snooze Tabs is such a brilliant utility.

Just hit the Snooze button in the topbar, and choose a time and date. The current tab will then inmediately close, only to be automatically re-opened at the specified date and time.

It's a super quick way to easily manage your browsing activity, and one of the most valuable tools for my productivity.

Side View #

Whenever I'm developing a web page, it's natural that I'd have to test it on narrow(er) viewports, for mobile and tablet scenarios (I even built a super simple utility for quickly doing so). Side View provides a convenient way to do that, while also potentially enhancing your browsing experience and productivity outside of development.

This super neat add-on adds a button on the location bar and top bar, and a context menu option that will open the current tab within the browser's sidebar. It also requests the site with a "mobile-like" User Agent string, which combined with the sidebar's generally narrow width, results in (most) websites rendering in their mobile version.

Navigation to the same domain stays within Side View, and anything else opens in the current normal tab. This enables enhanced browsing possibilities, such as:

Opening lists-of-links sites (reddit, twitter) in Side View and opening their links in the normal tab.
Comparing (shopping) items, one in the normal tab, one in the Side View.
Email in Side View, links from emails in normal tab.
YouTube or Twitch in Side View, while doing anything more involved in the normal tab.

Unfortunately, it doesn't play well with Containers; even if a page in on a Container, once it's sent to Side View it will not longer be "contained"- it will just be on the regular/default browser context.

Overall it provides a neat way to browse and use the web, and it's definitely a great tool for testing responsive-designed websites.

Update 11-02-2021: updated link to one of the apps as previous one was broken.

Apple Arcade is fantastic. Mostly.

2019-10-04T00:00:00Z

From the beginning I loved the fact that this is not a streaming-based service, which I really don't like at all. It makes so much sense to simply allow customers to download and play the games without worries of internet connection.
Being able to connect my DualShock 4 so easily is huge. And lots of game actually show the correct buttons (cross, circle, square) in their UI which is neat. It makes so much sense for Apple to allow DS4 and Xbox One controllers; if you have a PS4 or an XB1, Arcade becomes much more attractive from the start.
- I just wished it was easier to disconnect the DualShock when I'm done.
It's not very clear to me how the cloud saves / progress sync works. Is it based on Game Center? AppleID?
- It would be nice if there was a hub for managing save states. Or that games themselves confirmed in their own UIs about cloud syncing, otherwise.
Games like Rayman Mini send an interesting message to me about Arcade: the service could easily host a full-fledge game like Rayman Origins/Legends, but because of the "mobile-gaming" constraints - like no garantee of a gamepad - they have to be shrinked into smaller-scale experiences. But maybe that's a good thing.
The service is only going to get better when it's available on macOS and specially tvOS. But maybe then the games will feel too "small".
The sweet selling-point of Arcade is that all its games (going to be) playable on iPhones, iPads, Macs, and Apple TVs. But would it make sense at some point to have "big scale" games only for Macs or TVs?
I'm curious how often will Apple introduce new games into the service. The launch roster is excellent and very long already!
Maybe this information is available somewhere that I missed, but it would be nice to know how are developers being compesated for having their games in the service. Hopefully it's not based on time spent on a particular game!

Favourite games so far #

Rayman Mini: the style of Rayman Origins/Legends is gorgeous, and the auto-running mechanics feel quite flexible, and allow for a lot of puzzle-platforming.
Bleak Sword: simple and straighforward combat design, but with a nice challenging curve, and with lots of enemy variety. I don't think I could enjoy it without the DualShock, however; the touch controls are a bit quirky, I thought.
Sayonara Wild Hearts: the presentation and aesthetics and stunning. And the sheer amount of gameplay variety across stages (and even during the same stage) is quite impressive. Unfortunately my progress hasn't been saved in the first 2 ocassions, "forcing" me to start all over. Still, it's so enjoyable I have no problem going back!

Satelite beta

2019-11-20T00:00:00Z

Try the Satelite beta out now!

One year ago today, as part of "celebrating" the 6th anniversary of Reeddit's release, I announced I was working on "Reeddit 2".

It's been a whole year since then, and I have surely but very slowly been working on the successor to Reeddit.

But since today marks the 7-year anniversary of Reeddit's release, I have decided to just put the result of my work so far out there!

As mentioned at the start, Reeddit 2 is actually named Satelite.

One of the many lessons I learned with Reeddit was that "Reeddit" is not a good name for a Reddit client; people were always misspelling it, or thinking that "reddit" had been misspelt. Furthermore, .app domains became available every since, and I wanted to get one!

Satelite #

"Satelite" is Español for..."Satellite", but it's also a reflection of my effort to offer a lite (as in, lean and fast) Reddit experience, specially compared with reddit.com's own experience.

Why though? #

I built the original Reeddit out of the desire to have a better way to browse and read Reddit on my mobile and tablet, since back then they had a really lackluster mobile experience.

Turns out that while they improved this a lot in modern reddit.com, they are now annoyingly pushing their native apps while using it.

I built Reeddit, and now Satelite, because I wanted a simpler, faster, mobile-friendly way to browse and use reddit on the web.

What's new? #

The biggest change in comparison to the original Reeddit is that Satelite requires your reddit account to work. So you get your subscriptions and multireddits (I call them Channels), and you can save and vote posts. You can also un/subscribe to subreddits and create new Channels as well.

I will soon start working on taking more advantage of having the accounts, so you can comment on posts, and reply on comments and other pretty common stuff.

Feedback, please! #

I would love for you to try Satelite out and send me any suggestion you might have or bug report you might find.

Issues with HDMI, Apple's USB-C dongle, and my MacBook Pro.

2020-03-20T00:00:00Z

I was having issues with my MacBook Pro (13-inch, 2017, Two Thunderbolt 3 ports) when trying to connect my external screen with its HDMI cable via Apple's USB-C Digital AV Multiport Adapter a.k.a. dongle.

Basically, the MacBook wouldn't recognize the HDMI connection via the dongle, no matter which of the 2 ports I was using. Sometimes, not even the power charging would work, neither directly to the MacBook nor via the dongle.

I tried with another dongle of the same kind, and it didn't work either. And both dongles worked fine on another, similar MacBook model. It didn't seem to be a dongle issue.

This seem to indicate it was an issue with my MacBook itself. It could a hardware-software issue.

After DuckDuckGoing for driver-related issues, I found this Apple Support Page about resetting the System Management Controller. It provided the solution to my problem.

Solution #

Resetting the controller that handles the management of the USB-C connection a.k.a System Management Controller (SMC) fixed my issue.

These are the steps I took for my MacBook Pro (extracted and paraphrased from the article linked above. Might be different steps depending on your specific MacBook model):

Shut down the MacBook.
When it's off, press and hold the left-side control + option + shift keys.
While holding those keys pressed, press and hold the power key (on the upper right corner of the keyboard) to turn the MacBook back on.
Keep those 4 keys pressed for 10 seconds.
After those 10 seconds, release all the keys. The MacBook should bootup like usual, and the problem should be solved. It was at least for me.

Afterwards, both the HDMI connection and the power charging worked fine again, all from one dongle.

useDelayedDebounce react hook

2020-09-24T00:00:00Z

For whenever you need to react to a repeatedly-and-rapidly-fired event, but only some time after the last event occurred.

For example, when you only want to make a request based on the value of a <input type=“text”> but don’t want to send the request every time the user types each character.

`useDelayedDebounce.ts` #

import { useState, useEffect } from "react";

/**
 * Receives a value that is the result of a repeatedly-and-rapidly-fired event
 * and returns the value at the time after the last of those events ocurred.
 *
 * @param originalValue value to debounce off
 * @param delay amount of milliseconds to delay after the last event ocurred
 */
export function useDelayedDebounce<V>(originalValue: V, delay: number): V {
  // set the initial debounced value based on the original one,
  // and keep it in this hook's state
  const [debouncedValue, setDebouncedValue] = useState(originalValue);

  // Declare the side-effect that will handle the debouncing.
  // Will execute when the component is mounted.
  useEffect(
    () => {
      const handler = setTimeout(() => {
        // The debounced value will only be updated after the delay has passed.
        setDebouncedValue(originalValue);
      }, delay);

      // Clean-up. Will execute when the component unmounts.
      return () => {
        // Cancel the current timeout if it hasn't triggered.
        // If the original value changes before the delay time happens,
        // then this cancellation will prevent the debounced value from being updated.
        clearTimeout(handler);
      };
    },
    // Side-effect will execute when the original value changes
    // (which should be "a lot and very quickly" for this whole hook to be useful).
    [originalValue]
  );

  return debouncedValue;
}

Usage Example #

const debouncedTextInput = useDelayedDebounce<string>(textQuery, 500);

// side effect that fetches a thing with the text field's value as input
useEffect(() => {
	makeFetch(..., debouncedTextInput, ...);
}, [debouncedTextInput]);

In this usage (contrived) example, the side effect that will make the fetch will run only after 500 milliseconds have passed after the user stopped updating the text field. So no matter how quickly the user is typing, deleting, and otherwise updating the text field value, the request will only be made half a second after the user stopped updating it.

The best from last-gen consoles; screenshots, video captures, and photo mode.

2020-11-15T00:00:00Z

This week I bought a controller for my Nintendo Switch and only when I started using it I realized there was no “capture” button in it. That meant not being able to take a screenshot or save a video recording of the games.

Only then I realised how important this feature was to me.

The new generation of home game consoles started this week - current-gen became last-gen, and next-gen became current-gen - with the releases of Xbox Series X and PlayStation 5. And they bring lots of promises for what "the new current-gen" is supposed to mean.

But just now, after not having a “capture” button on my controller, I looked back and realised what the most meaningful features from last-gen were to me: having the ability to take a snapshot of a nice looking or memorable moment of a game, while it’s happening, knowing that it will allow you to re-live it as much as you want in the future without having to actually replay the game and having to attempt to reproduce the moment is a brilliant feature which I love.

Combine that with Photo Mode - which granted, not every game has one - and you get a winner combo of game memories preservation and in-gaming photography.

More and more games are including Photo Modes that allow you to pause the game at any moment during gameplay and manipulate the camera, lightning, which characters are visible in the shot, and many more things, all in order to provide tools for taking great game moments. I love it.

I have spent a long time just doing “game photography” - which at the same time, makes me appreciate more the artwork, art style, graphics quality and in general the visuals of the games.

And being able to record videos has allowed me to re-watch great story moments and standout gaming experiences - beating a difficult boss, completing a challenge, or finishing a great set-piece - it’s a great way to go back to the game without having to actually play it again (which sometimes I simply don’t have the time to do, as much as I’d like!).

Besides the same promises of even-better looking, higher-fidelity game visuals that come with every new generation of consoles, it’s this peripheral kind of features that end up being the more important legacies of a console and its time.

Quickly toggle Dark Mode on macOS via Automator

2021-02-11T00:00:00Z

I like having a fast way to toggle Dark Mode, preferrably via the keyboard.
Turns out it's very simple to set this up without needing any third-party app:

Open Automator.app. Included in macOS.
Create new Application. Either via the initial popup or by going to File → New in the top menu.
Find and add the "Change System Appearance" action. Either by double-clicking on it or dragging it into the right panel.
Make sure the Change Appearance action is set to Toggle Light / Dark.
Save the app as "Toogle Dark Mode" and put it in the Applications directory.

That's it! Opening this app will simply toggle Dark Mode immediately.

Combined with Spotlight (or Alfred) and you can quick-n-easy Dark Mode toggling via the keyboard.

More iPad, less MacBook

2022-10-17T00:00:00Z

I’ve realised that most of the things I used to do and enjoyed doing on my laptop, I do them now on my tablet.

I think it started with the pandemic lockdown. Working from home all the time - which was something I was very happy with - came with an unexpected disadvantage: after spending my day working - sitting on my desk using the company laptop - I didn’t feel like using my own laptop at all, afterwards. The laptop had become a tool for work and I didn’t want to use it for anything else because it just reminded me of work.

Now, this is not to say I don’t enjoy my job or anything like that. I very much love it, specially now that I get to do it from home. But the fact that I do it at home means that it’s a bit harder to separate work from my personal life, and in my mind, having a separate device and form factor (the tablet) for my personal projects and tasks makes it easier to provide that healthy separation.

But even more than that, I enjoy the extra portability of the tablet over the laptop. The iPad Pro is lighter and a bit smaller than the laptop - 11” vs. 14” respectively in my case. Which allows me to do my things pretty much anywhere in the house.

Most importantly, the touch screen. I know none of this is new and it’s in fact taken for granted by everyone since these technologies have been ubiquitous for a long time now, but being able to do my computing on a touch screen feels fresh, fun and engaging in a way that a keyboard and mouse is not.

Coding is the only thing that I still prefer to do on a laptop, because it’s still more comfortable and effective than on a tablet, or possible at all. Trying to do it on the iPad is extra difficult since you cannot have normal access to any programming language or development environment on it. There are ways: either using a Terminal-like app to connect and write to an external device which is doing the actual processing of the code is one. A more straightforward approach is using Web IDEs like glitch.com, codesandbox.io, github.dev, and vscode.dev from the browser. You still need to connect a keyboard to make this comfortable enough, but it gets you closer to “the real thing”.

Perhaps a good native code editor already exists for iPadOS and I’m just not aware of it - one that still would need to connect to an external machine that does the code processing, but that at least makes the code-editing experience feel truly native on the iPad. My ideal scenario, however, would be a completely touch screen-centered interface for “writing” code without actually needing your keyboard as much or at all - perhaps only for naming your variables - and where everything else is done by using the touch-screen and its interactions to the fullest, for a more “interactive” and engaging experience.

All in all, using the iPad feels more instant, more engaging, and even though its operating system is very strict and constrained when compared with a desktop-class OS, I’ve actually enjoyed the simplicity that comes with that.

Maybe at some point I’ll get to completely move everything to the tablet - all iPad, no MacBook.

Easier dark-mode CSS with Sass

2023-03-28T00:00:00Z

When offering a dark-mode for a website, you probably want to offer an "automatic" or "system" option which follows the OS-level user preference for dark mode instead of explicitly forcing a light or dark mode.
This way, visitors can choose:

dark: for always dark-mode
light: for always light-mode
auto: for automatically switching between dark/light based on operating-system setting.

Writing the CSS for dark-mode that covers these options currently requires a lot of boilerplate, however. With the setup and the Sass mixin I'm sharing next, it should hopefully be easier to handle this.

Note: we're not focusing on the mechanics of how to switch between these options using JavaScript in this post. We're focusing on the CSS implementation specifically.

The setup #

On your document, you're going to add a data-theme attribute to the root <html> whose value will be the currently chosen option:

<!-- always dark-mode -->
<html data-theme="dark"></html>

<!-- automatic / based on system preference -->
<html data-theme="auto"></html>

Again, how you chose to update this value on your pages is outside of the scope of this post.

The Sass Mixin #

Here's the mixin that takes care of everything:

@mixin on-dark-mode {
  @media (prefers-color-scheme: dark) {
    html[data-theme="auto"] & {
      @content;
    }
  }
  html[data-theme="dark"] & {
    @content;
  }
}

And here's how to use it:

.some-component {
  // base / light-mode styles
  --bg-color: white;
  background-color: var(--bg-color);
  color: black;

  // dark-mode styles
  @include on-dark-mode {
    --bg-color: black;
    color: white;
  }
}

I use this mixin in any Sass project I work on, and so far it has worked nicely!

Limitations: can't be used for root/html styles #

The only downside to this mixin (that I'm aware of) is that it can't be used for declaring dark-mode styles in the :root or html element;
it only works for decendants of it, starting with body.

This means it can't be used to define a set of "global" colors as Custom Properties to be updated based on dark-mode, for instance.

The future: simpler implementation #

Hopefully sometime later in 2023 we will be able to use style queries to simplify and shorten the code needed for robust dark-mode support.

ZapKeys

2023-03-31T00:00:00Z

ZapKeys is a JavaScript UI utility that makes it super easy and quick to add keyboard shortcuts to any page.

Try it now #

The easiest way to see it in action is by pressing the F key now, on this page!

What it does: a different approach to shortcuts #

Instead of requiring visitors/customers to learn and memorize some set of keypress combinations for your website, ZapKeys simply shows a key or key-sequence above each interative element on the page. They can then press the key/sequence and the corresponding element's interaction will be triggered.

So buttons and links will be clicked, forms fields will be focused on, etc. All without needing a pointer device or mouse.

How it works #

When it's activated by the end-user - by pressing the preconfigured activation key - ZapKeys grabs all the currently-visible interactive elements of the page (buttons, links, form-fields) and adds an overlay with a unique key/sequence over each element. Then, when one of the key-sequences is pressed, the corresponding element's interaction is triggered.

The easiest setup #

My goal was to make setting it up as easy as possible; with the default configuration and in the simplest implementation, you only need to:

Include ZapKeys' CSS, and

Import the JS module and initialize it:

<!-- On your HTML -->
<link
  rel="stylesheet"
  href="https://unpkg.com/zapkeys@0.2.1/dist/index.css"
/>

<script type="module">
  import { ZapKeys } from "https://unpkg.com/zapkeys@0.2.1/dist/zapkeys.esm.js";
  const zapkeys = new ZapKeys(); // default config - pressing 'F' will activate the shortcuts
  zapkeys.init();
</script>

That's it! This is exactly the setup used in ZapKeys' homepage.

Naturally there's more configuration options to customise ZapKeys - you can check those on the npm page. It's also available for bundling via npm i zapkeys or yarn add zapkeys.

Years in the making #

I started working on this utility around five years ago!

I was inspired by Number overlays in Voice Control for macOS which was announced around that time. I thought that while it would be difficult to make it work by voice on the browser, it was nice how Voice Control added a visual indicator for each element that you could interact with. I figured the next best thing was to make it work with the keyboard instead.

While looking for existing libraries that implemented this solution I only found "traditional" shortcut libraries. But then I found Vimium which has a feature that's pretty much what I had in mind, but wasn't a library that I could use on my own sites. That's when I decided to build it myself.

At some point it was working well enough in both Satelite and on this website so I considered it finished. Later I published it in npm as "Teclas" but I never worked on announcing or actually sharing it, I think partially because I didn't like the name.

Years later I came up with the new name and thought about renaming it and publishing it. But then I didn't. And more time passed.

Only a few days ago I found a bug which prompted me to update it with the fix and get it ready for publishing, actually for real this time, fr fr.

TSDX made it very easy to get ZapKeys ready as a npm library.

And here we are! ⚡

Album Whale

2024-06-08T00:00:00Z

Album Whale's homepage does a fantastic job at letting you know if it's something you would enjoy. It immediately hooked me.

It's a simple website: you create an account and make lists of music albums. That's it. You can keep them private if you want to use it for tracking your own stuff, or make them public for sharing with others.

I had been meaning to create a simple page for my vinyl collection for a while, so AW came in perfectly.

Some super lightweight social bits add a bit of fun and make for potentially discovering new music, too; there's a Discover page which highlights the public lists, and liking others' public will probably influence what's shown on some parts of this Discover page.

Here's my Album Whale profile.

"Let's bring back albums!".

💿 🐋

Revisiting The Last Of Us Part II

2024-12-24T00:00:00Z

A recent family tragedy strangely prompted me to revisit this game for the first time since the original release. This personal loss left me feeling heavy and numb, and I felt like playing something equally heavy and dark as a channel for catharsis.

Frankly I just wanted to experience the story again. I remember that the first time I played it, I was always stressed and tense because of how hopeless the atmosphere feels and how oppressive the gameplay is. I definitely didn’t want to go through that again, so I chose the Light difficulty. It worked; it was still immersive and involved enough to make it exciting without it becoming overwhelming. The fact that I already knew when the big events were coming helped me better prepare for them. All in all I ended up appreciating the story much more.

I adore this story. It expands an already interesting setting into a fascinating world. The Wolves and Seraphites and their clash in the North, and the Rattlers in the South; how each area or population can evolve (or devolve) so wildly and differently; how the good-natured ideas of an individual can be twisted over time into an extremist cult; how one people’s “happy” ending can be the beginning of a nightmare for another. The corrosive nature of hatred. Guilt and redemption. Regrets and amends.

Now this world has its teeth on me; I want to listen to the official accompanying podcast, re-watch the making-of documentary, and replay the story with the developer’s commentary. Of course I’m super eager to watch the TV adaption of Part II. And finally, I’m really hoping we get see where Ellie, Abby, Lev, and Dina are in Part III.

Here’s to the future days.

Also published as a review on my backloggd profile.

Best Of 2024

2024-12-31T00:00:00Z

Making lists is fun. It's one of the reasons I love using letterboxd, backloggd, and album whale. But I haven't made one of these for this blog in a long time and since I've decided to make and effort of writing more here, it was a good way to get back on it.

So these were my favourite game/film/music/show releases of 2024. The lists have no particular order.

Games #

I played a lot of games in 2024, but only a handful were actually released this year. I guess the journey to be more of a "patient player" is ongoing.

1. Like A Dragon: Infinite Wealth #

Ridiculously massive and oh-so-fun. It's easily my favourite entry on the series so far. I started playing it right after it released and only finished a few weeks ago—both because I took my time, took breaks, and jumped to other games in between.

I didn't even dig into the Sujimon (Pokemon-inspired) and Dondoko Island (Animal Crossing-inspired) side-games! Who knows how long it would have taken me to get through those.

The jobs are hilarious, the battle system is a blast, and the side-stories are as crazy, creative, and emotional as ever. I specially love that it's a Japanese RPG where the main cast is made of grown-up adults and besides the hilarious insane special moves and abilities in battle, it's a pretty grounded story.

It's the complete package.

2. Astro Bot #

Absolute joy and nostalgia turned into a modern 3D platformer. Just by looking at the previews of this game—and based on the excellent previous entries in the series, Rescue Mission and Playroom—I knew Astro Bot was going to be special. It was pretty much what I expected: a wonderful, creative, funny, super fun, optionally challenging, and ultimately rewarding experience. Specially as a fan of PlayStation and its history and legacy, to which the game pays a lot of homage to. A certified classic.

Here's my review of Astro Bot on Backloggd.

3. Prince Of Persia: The Lost Crown #

The best Metroidvania that I've played since Hollow Knight. You can just tell the game was made with lots of passion and attention to details. The combat, exploration, puzzles, and platforming are fantastic and super rewarding. The setting is intriguing and captivating and the story and characters were engaging enough to keep me motivated to move forward. I really hope this team gets the chance to follow-up on this amazing entry. If not, at least I have the DLC as an excuse to revisit it.

4. UFO 50 #

A staggering achievement in the indie space. It's 50 "NES-scale" games—meaning, these are full-blown games at a level similar to the ones originally released during the NES lifetime; these are not "mini-games"!—but exploring either new ideas or variations of the premises from the games of that era with a more modern twist, all packaged and presented as a collection of a fictional console from that time.

At the moment I haven't even played all of the games yet (I've played a bit more than half of them) and even though not all of them are my jam, the ones that I've liked are really, really fun and engaging. Some could have been released as standalone games and they surely would be well received on their own. Lots of the game have "couch" multiplayer modes as well!

These are my favourites so far, in "chronologic" order by "release date": Ninpek, Magic Garden, Velgress, Attactics, Avianos, Bushido Ball, Block Koala, Camouflage, Campanella, The Big Bell Race, Warptank, Porgy, Rakshasa, Pilot Quest, and Seaside Drive.

All in all, UFO 50 provides insane value in many ways and is without a doubt one of 2024's gaming highlights.

Films #

These last few months of the year have sadly been devoid of film-watching. I think I've watched maybe 3 or 4 films in total in the last 3 months! I know there's a lot of great stuff that I've missed from the last quarter of the year. I just hope I get to catch up on them sooner than later.

1. Dune: Part Two #

I've watched this film 4 times - 3 of those in the cinema. It's definitely my favourite film of 2024. Here's what I wrote about Dune: Part Two on Letterboxd. It's a highly rewarding experience, visually and sonically stunning, and ever more grandiose in scale. Peak sci-fi, specially paired with Part I.

2. Inside Out 2 #

I loved the original one, and was frankly doubtful about this "unnecessary" sequel. In retrospect a sequel was inevitable; given the critical and commercial success of the original, the potential of exploring the mind of an older protagonist as a premise, and the state of Pixar (or Hollywood in general), a follow-up was a no-brainer. And oh they pulled it off. I watched it with family in a movie theatre in Seattle while visiting my sister, and we all ended up crying by the end. The depiction of anxiety was cathartic.

3. Challengers #

A sweaty, steamy blast. Reznor & Atticus' feverish soundtrack completely elevated the whole thing.

4. Alien: Romulus #

After the disappointment that Prometheus (incredibly hyped, still good, but not great) and Covenant (plain bad) turned out to be, I was actually looking forward to a new promising director taking over and I'm quite happy with what Fede Alvarez delivered. Romulus has some intense set pieces and surprisingly great character moments. A few things stood out as tad unearned and perhaps treaded familiar grounds, but it's overall a fantastic return to the universe of Alien.

Music #

I feel like this year I didn't go out of my way to discover new music nor dig into new releases from my old favourites. The few ones that I did spin and enjoy (like King Gizzard's Flight b741, Frost*'s Life In The Wires, Billie Eilish's HIT ME HARD AND SOFT, THUS LOVE's All Pleasure, and Childish Gambino's Bando Stone and The New World) didn't really grab me enough to put them on my list.

But there was one album that came out of nowhere and instantly hooked me, so much so that it's the only entry on my list.

1. Blood Incantation's Absolute Elsewhere #

I had never heard of this band at all, but I suddenly saw some buzz around this release from metal-heads in my social media spaces. Finally, it was one of Mike Portnoy's posts on Instagram, which recommended the album and—more importantly—featured the cover artwork, what prompted me to give it a spin for the first time. Seriously, I loved the album cover artwork from the moment I first saw it and now I feel it perfectly captures the atmosphere and tone of the music therein. It's a true musical journey which jumps between death metal, electronica, psychedelic rock, and progressive rock, in both an elegant and intense package.

This is also the album that finished the dominance that King Gizzard And The Lizard Wizard had over my music listening the entire year.

The year of King Gizzard And The Lizard Wizard #

The reason I didn't have time to discover almost no new music from 2024 was because I invested it all in discovering the music from KGATLW (which was effectively new to me).

Even though I first listened to KGATLW in 2023, it was actually this year that I really got into them and became completely enthralled by their insanely expansive discography, their music creativity, their work ethic, and their overall output. It was just so much fun and so rewarding to try and dig into any of their twenty-something released albums and discover what genres and which crazy, ambitious ideas they decided to tackle on each of them.

Funnily enough, their one proper new music release this year - Flight b741 - didn't really vibe with me that much; "Le Risque" was the only song from it that I've kept in my constant rotation.

However, lots of their previously released albums completely took over for the vast majority of my 2024. In no particular order, these were the KGATLW albums that decorated most of my time throughout the year:

PetroDragonic Apocalypse: incredible concept album from start to finish. It's a thrash and progressive metal album with a classic, vintage, raw sound. The first album from them I listened to.
Butterfly 3000: an electronic pop/rock outing filled with uplifting and catchy hooks. Just feel-good tunes here!
Nonagon Infinity: 9 buzz-filled punk songs, all connected, and forming a never-ending listening cycle. One of my most played.
Polygondwanaland: intricate, progressive, and highly creative. Crumbling Castle might be one of my favourite songs ever.
Infest The Rats' Nest: another thrash concept album with even rawer energy and more garage sound.
The Silver Cord: full-blown psychedelic electronica.

TV Shows #

Finally, these are the highlights from shows on streaming platforms.

Shōgun: excellent from start to finish. Fascinating, memorable characters and an alluring, mysterious plot, all delivered with incredible performances and technical prowess.
Arcane: among the most stunning animation work ever, and filled with memorable, complex characters, but with a tad disjointed story as it went on. While not as sublime as Season 1, it's still a technical and storytelling benchmark.
Fallout: The Ghoul stole the show. A surprisingly funny, twisted, and gripping story. Got tired of the old-time music pretty quickly but the rest of it was a total ...blast.
Dandadan: came out of nowhere for me, and from the first minutes of the first episode (that intro!) I was entranced. It bursts with style and charm.
Kaos: such a disappointment that this was cancelled so quickly after premiering! While it did have a couple of rough moments, I thought the overall setting of "ancient-greek mythology characters in the modern-day world" was an interesting, fresh premise that was nicely executed. What a shame.
X-men '97: I wasn't even that big of a fan of the original show (except for that opening theme of course!), but the premise of a follow-up more than 15 years later was exciting, and '97 came in and utterly surpassed any expectations I had. Great animation but specially fantastic characters and emotional moments, and the setup for Season 2 makes the wait all the more hard.
Baby Reindeer: the fact that this is based on a real story is just wild and heartbreaking. A tour de force by the leads and a crushing, riveting story.

They announced the Switch 2, finally

2025-01-16T00:00:00Z

🔗 Nintendo Switch 2 – First-look trailer.

Some quick thoughts:

Feature- and offering-wise it's pretty much what I expected: a safe upgrade without risks. Nintendo probably doesn't want to mess with their winning formula.
Also unsurprising but still worth commending: backwards compatibility both physical and digital. It would have been alienating otherwise.
Hopefully the bigger size (bigger screen!) means actually comfortable controllers.
Bigger buttons in the controllers and more space between them is super welcomed. However,
It doesn't seem like the new controllers have any grips. After having the comfy grips on the Steam Deck it's too bad Switch 2 won't offer anything similar.
Very curious about what looks to be mouse-like functionality for the controllers.
The magnetic attachment of the controllers to the console looks great.
They're going to exhibit the new console in special events across the world, including Amsterdam! Will try to attend.
Is that a new Mario Kart game, then? It doesn't look that different from MK8 so it's hard to tell.
Overall I'm not excited yet. Will have to wait for proper game announcements and more details on the hardware.
I will most likely get it sooner than later anyway (I'll be there day one when the new 3D Mario is out).

Sticker-bombing my laptop

2025-01-23T00:00:00Z

I can never have enough stickers. I love them. But for a long time I would hesitate on actually using them because "what if it was the wrong place for it?". I was afraid of "wasting" my precious stickers on stuff that maybe I would need to replace or get rid of some time later. So I started accumulating them and then doing pretty much nothing with them, just sticking some of them here and there every once in a while.

But of course the point of stickers is to cover stuff with them! Not just collecting them and keeping them hidden away in some drawer, but to actually see them in the stuff you use or in spots you pass by regularly. Once I stopped feeling "sticker anxiety" I started looking everywhere for a nice spot to put stickers on.

First attempt #

Once I decided I wanted to sticker-bomb something, I chose to start with one of the cover plates of my PS5. And I learned an important lesson: do not start with your "nice" stickers—the ones you want to actually display when you're finished. It's obvious in retrospective, but I was excited to start putting my cool stickers on it and then when it was time to cover the spaces in between, I started feeling a bit sad that I'd be covering them with less nice-looking ones. So I only added small generic stickers that wouldn't obstruct the previous ones and it all ended up looking pretty rough and lame. Now I have one PS5 cover plate half-full of nice stickers, less-than-nice ones, and lots of white-space, and I guess it will stay that way!

So yeah, you should start the "base layer" with the big, random, more generic stickers—the ones you don't care too much about because their main purpose is to fill-up the background.

Doing it right ♪ #

Last year, while visiting Seattle I bought a couple of sticker books—the ones that got pages and pages of stickers from different artists and styles—which are precisely designed for sticker-bombing. But even after I got them, I wasn't sure where to use them—definitely not on the PS5 plate! That's when I put my eyes on my laptop.

I've had my laptop (a 13-inch M1 MacBook Air) since pretty much its original release date in 2020. I love its pinkish gold color finish, so back then I had decided to only put one sticker on the corner to, you know, keep it classy (also, the aforementioned sticker anxiety).

Even though I try to use my MacBook less often in favour of my iPad I have recently been going back to it more because it's naturally much more comfortable to code and write on it. I still love this laptop; it's as powerful and feels as snappy as when I first got it. So I figured it's a good time to freshen up its looks. And not just by putting a few stickers on it—I've always put a handful of stickers on my previous laptops—but now I wanted to go all-in on it; to cover the entire lid with sticker art. A proper sticker-bombing.

This time I did start by covering the base with "random" stickers—some are really nice anyway!—and once it was mostly covered, I'd bring in some of the stickers I really liked and wanted to appreciate every time I looked at the back of the laptop.

Doing the base layer was a quick operation. Even faster if you see the time-lapse video I recorded for it: time-lapse video on my mastodon profile.

I then added a handful of my "nice" stickers to fill the bits that seemed empty or weird.

The result #

A messy, beautiful wall of sticker art!

Some of the nice stickers I chose to include initially are:

The 4-star dragon ball, which I got in a Shōnen Jump pop-up store in Tokyo.
The Hologram one, which came with the Chroma Console.
A couple of small Afro Ken ones that I got in Seattle.
The immigrant butterfly, which I got in Bogotá.
The space station, which I got from Kurzgesagt , and
A Traveller's Company one that I got at Narita Airport.

All in all I'm super happy with the result. There's still some space that I can fill with some nice stickers later if I feel like it. But at the moment I love looking at the little rectangle full of art that my laptop lid has become.

Everywhere now #

If you've been saving your big collection of stickers for "just the perfect spot", the "right place" to put them, let go of that and start sticking them wherever they'd spark joy in this moment. In your thermo, water bottle, tablet and phone case, your laptop, e-reader, your luggage, the fridge, your powerbanks, notebooks, your bike. Sticker-bomb all the things!

Next To-Do: a Shortcut for your next task in Reminders.app

2025-02-12T00:00:00Z

Fill out the tasks you want to accomplish, then roll a d6 to determine which one to work on. Roll again to determine how long to work on it.

That's the super simple premise of Paper Apps' TODO and it's extra fun and engaging as it's done in a physical notebook and, ideally, with an actual dice as well. It gamifies your day-planning while also removing the burden of having to choose a task or how much time to invest on it.

I really liked the premise except I didn't want to write the tasks every day so I thought of applying the pattern to my digital to-dos. It's definitely less fun and gamey than the real pen-and-paper thing, but it's still very useful and specially helpful when you can't be bothered to decide what to do next.

Fortunately it's possible to accomplish this with Apple Reminders, which is what I already used for my to-dos, thanks to its integration with Apple Shortcuts.

The shortcut picks one random item (overdue or due-today) from a list in Reminders, then it randomly picks a duration between 5, 10, 15, 20, 30, and 45 minutes, then it shows a message with the result and asks whether to set up a timer for the chosen duration. That's it! Naturally it works on macOS, iPadOS, and iOS.

If you think it might be useful for you as well, feel free to grab the Shortcut here (please note that it won't work "out of the box"; you must specify which list from your Reminders you want to use. I haven't figured out how to make this part of the shortcut).

Preventing race conditions between sibling htmx elements with `hx-sync`

2025-03-07T00:00:00Z

Today I ran into this scenario while building a tabs-like component with htmx:

a list of buttons all next to each other,
each button triggers its own request, but
the response of each request targets the same element.

<button hx-get="/op?action=a" hx-target="[data-result]">Show A</button>
<button hx-get="/op?action=b" hx-target="[data-result]">Show B</button>
<button hx-get="/op?action=c" hx-target="[data-result]">Show C</button>

<section data-result>
  <!-- html response from any of the buttons goes here -->
</section>

With this setup it would be possible for this flow to occur:

User clicks Button A.
1. Request A is made.
User clicks Button B (before the Response A is complete).
1. Request B is made.
Response A takes too long.
Response B completes. Content B is shown.
Response A completes. Content A is shown (replacing Content B).

Resulting in the content from Button A's response being shown despite the fact that the last click was done on Button B. So, a race condition which would be confusing and frustrating for the user.

Fortunately htmx does provide a way to manage this scenario via hx-sync, although it took me a while to grasp how to use it from its documentation.

How I solved it #

I wrapped the list of buttons on a div element which has the hx-sync attribute set to this:replace:

<div hx-sync="this:replace">
  <button hx-get="/op?action=a" hx-target="[data-result]">Show A</button>
  <button hx-get="/op?action=b" hx-target="[data-result]">Show B</button>
  <button hx-get="/op?action=c" hx-target="[data-result]">Show C</button>
</div>

<section data-result>
  <!-- html response from any of the buttons goes here -->
</section>

Let's break it down:

hx-sync can be inherited, which means we can declare it on a parent so it affects all of its children. So we put it on a div which is now the parent of the buttons.
The this part of the attribute's value refers to the div element itself. Combined with the fact that it's the parent of the buttons, it results in the requests of the buttons being "synced" with each other.
The replace part of the attribute's value determines the syncing strategy. There are multiple options here. I went with replace because it cancels any existing in-flight request when a new request is made.

With this, the improved flow goes like:

User clicks Button A.
1. Request A is made.
User clicks Button B (before the Response A is complete).
1. Request A is cancelled. Response A will never complete.
2. Request B is made.
Response B completes. Content B is shown.

Therefore guaranteeing that only the response from the last clicked button (Button B in this example) is always the one shown.

✨✨✨

The Switch 2

2025-04-02T00:00:00Z

I was looking forward to today's presentation about the new Switch and now I feel like geeking out about it. Here's some quick thoughts:

We'll have to wait for confirmation of course, but it seems like it might indeed be more powerful than the Steam Deck, which is promising.
Love the magnetic attachment for the controllers.
The mouse functionality is interesting and intriguing, but I'm skeptical about the comfort and ergonomics.
GameChat is definitely a swing; I don't see myself using that UI which makes my own game smaller overall. But it's nice that they're finally catching up on this in general I guess. It is weird, however, that they put a dedicated button on the controllers for a feature that will require a subscription.
Biggest letdown is the screen; back to LCD instead of OLED and the bezel is annoyingly thick. They will likely release a hardware revision with an OLED, larger screen (and therefore thinner bezels) later on. Which is a shame and makes me consider waiting.
The biggest pulls for me are: being able to play GameCube games (Wind Waker! hopefully Rogue Leader!) and specially replaying Tears of the Kingdom at 60 frames-per-seconds.
I definitely would try to get that new GameCube controller.
It's insane that they're charging any amount of money for what essentially seems to be a tech demo. In contrast, Sony gave away a brilliant precursor to a game-of-the-year title in Astro's Playroom.
I'm afraid there were no new titles that made me excited enough to pull me into trying to get the console during the release window. Mario Kart World and Donkey Kong Bananza both look really, really great but they're not console-movers for me.
The prices… oof. Yikes, even. Almost €500 for the console and €90 for physical games is a hard pill to swallow.
Perhaps none of this will matter to me once they announce the new proper Zelda and Mario games. Odyssey was the sole reason I got the Switch 1 back in 2017, after all.
Overall, I was more excited about it before the announcement than after, but it's great to see that Nintendo is keeping the momentum going and mostly improving on the whole experience.
The Switch 2 will be a hit for sure. I'll just have to wait until the right games—and perhaps a revised OLED edition—are out.

Disable scrolling for a modal dialog: my first use of CSS `:has`

2025-04-12T00:00:00Z

The CSS :has() pseudo-class makes it possible (and straightforward) to prevent scrolling on a page while a dialog is open. This week I got to apply this technique which was my first ever use of :has()!

Here's the full snippet as a one-liner:

body:has(#my-modal[open]) { overflow: hidden }

Let's break it all down.

The `dialog` element as a modal #

I have a dialog element that is opened via the showModal() method.

<dialog id="my-modal">
  Modal content here
</dialog>

<script>
  document.getElementById("my-modal").showModal();
</script>

Calling showModal() on the dialog automatically adds the open attribute to it.

              <!-- added attribute
                      ↓↓↓↓ -->
<dialog id="my-modal" open> 
  Modal content here
</dialog>

Which allows us to select the dialog specifically when it's open:

#my-modal[open] {
  /* styles applied to the dialog
  only for when the dialog is open */
}

Critically, #my-modal[open] is a conditional that essentially means "when #my-modal is open".

Naturally, when the modal dialog is closed, the open attribute is automatically removed, disabling the selector above.

Modal `dialog` does not prevent page-scrolling #

A modal dialog automatically moves the focus to the content inside the dialog and "traps" it there, which is exactly what a modal UI should do.

However, even when a dialog is open as a modal, the rest of the page — what's "underneath" the modal — can still be scrolled through normally, which is not always what you want.

Prevent page-scrolling #

The way you would normally disable scrolling on a page is by applying overflow: hidden to the body or html element.

body { overflow: hidden }

But we only want to do this when the dialog is open! And this dialog element can be anywhere on the page (inside the body).

`:has()` as a "global observer" #

By attaching :has to the body selector we're enabling a pattern where the styles will only be applied to the body when the "sub-selector" inside the parens in :has() is active.

In other words, the body element is now observing for the "condition" defined in the sub-selector to be true in order to apply the styles, and it's doing this observation for any element inside itself.

body:has(conditional-selector) {
  /* styles applied to body
  only when the condition is true */
}

All together now #

At last, we have:

The styles we want want to apply to the body to disable page-scrolling: overflow: hidden.
The conditional that represents when we want to apply those styles to the body; "when this specific modal is open": #my-modal[open].
The :has operator that connects both and makes it all work.

The result (same as at the beginning of this post, but broken down in parts):

body
  :has( /* 3 */
    #my-modal[open] /* 2 */
  ) { 
  overflow: hidden /* 1 */
}

That's it ✨

This is a super flexible technique to have as part of your tool-belt. Of course it doesn't have to be a "global observer" only; it can be scoped down into a smaller section or component of a page, and any element attribute can be used as a conditional.

The possibilities with this usage of :has are endless.

New music: "travel by night"

2025-09-22T00:00:00Z

I'm currently obsessed with Strudel. Last week I started learning how to use it and was immediately inspired to write a song and after a few couple-of-hours sessions in different days, I finished it. I called it "travel by night" and you can listen to it here.

One interesting thing about the Strudel website is that it encodes your source-code from the REPL into a base64 string and puts it on the URLs hash-fragment. And when opening that URL, on page-load Strudel decodes that hash fragment and places it in the REPL. This way, you're able to share your creation easily by simply sharing a strudel.cc URL with a very long hash-fragment. Pretty neat! Of course, if you update your song's code, the hash-fragment gets updated but your previously shared URL naturally will not include your latest updates.

So, as a way to properly preserve the source-code for "travel by night", here it is:

// "travel by night" by ber baquero

$: sound("[~ hh]!4").bank("RolandTR909");

$: sound("bd*4").bank("KorgDDM110").room(1);

$: note("<[c1 c2]*4>")
  .sound("gm_synth_bass_1").lpf(5000).decay(.2).sustain(.3)
  .color('cyan')._pianoroll();

$: note(`<[c4, e] [e, g] [f, a] <f3*8 f4*8>>`)
  .sound('bytebeat').room(1).gain(.5).decay("<x x x .5>")
  .mask("<0 1 1 1 1 1 1 1 1>/8")
  .color('magenta')._pianoroll();

$: note(`[g4 e4 f4 <c4 c5>]*4`)
  .sound('bytebeat').delay(.3).gain(.365)
  .mask("<0 0 0 1 1 1 1 1 1>/8")
  .color('yellow')._pianoroll();

$: note(`<g5 e5 f5 <c5 c6>>`)
  .room(1).delay(.5).gain(.5)
  .mask("<0 0 0 0 0 1 1 1 1>/8")
  .color('yellow')._pianoroll();

$: note(`[g5 e5 f5 <c5 c6>]*4`)
  .sound('bytebeat').delay(.9).gain(.2)
  .mask("<0 0 0 0 0 0 0 1 1>/8")
  .color('yellow')._pianoroll();

$: sound("~ sd ~ cp")
  .bank('r8').lpf(4000).room(.4).gain(.7)
  .mask("<1 1 1 1 0 0 0 0 0>/8");

$: sound("[~ [sd, cp]]*2")
  .bank('r8').lpf(4000).room(.4).gain(.7)
  .mask("<0 0 0 0 1 1 1 1 1>/8");

$: sound("[~ ~ ~ oh]")
  .bank('RolandTR909').gain(.365).room(.7)
  .mask("<0 0 0 0 0 1 1 0 0>/8");

$: sound("[~ oh]*4")
  .bank('RolandTR909').gain(.4).room(.7)
  .mask("<0 0 0 0 0 0 0 1 1>/8");

This should be enough for now but perhaps later I will create a separate page where I embed my own Strudel instance to showcase all the stuff I create with it.

Web Component

2025-10-01T00:00:00Z

A few weeks ago I started doing Weeknotes in here and I'm really enjoying it. But whenever I wanted to write about something I watched or played that I didn't want to spoil for visitors, I would just skip it, which is not ideal because I do want to log all my thoughts about what interests me in the moment!

To fix this, today I created the first version of a simple Web Component that initially hides the spoilery text and only reveals it when clicking the hidden block.

I called it <bbq-spoiler>.

Here's how it's used:

My favourite film of 2025 is <bbq-spoiler>'One Battle After Another'</bbq-spoiler>

And the result:

My favourite film of 2025 is 'One Battle After Another'.

Notes #

Accessibility: screen readers announce "Spoiler" instead of the spoilery text.
Copiable: the hidden/spoilery text can still be copied.
Built for this site: I kept it simple by writing this component specifically for my website. But it should be easy to grab the source code and modify it to your needs. Just view-source this page!

Best of 2025

2025-12-31T00:00:00Z

Just like last time (rather, last year), here are my various lists, in no particular order, of my favourite pieces of art and entertainment released during 2025. And just like last time, I only managed to get it out on the last hours of the last day of the year.

It fun to put this together, but also felt like a adrenaline rush to finish it before the actual end of 2025. Here we go:

Music #

Rosalia’s LUX #

A daring, bittersweet, mournful, and blissful masterpiece. Not a mere collection of songs but a complete journey with a beginning and end. And what an end. I believe an album is only as great as its closing track, and Magnolias is a stunningly powerful and heart-wrenching closer. "Yo que vengo de las estrellas, hoy me convierto en polvo, pa' volver con ellas". Favourites: Reliquia, Mio Cristo Piange Diamanti, Dios Es Un Stalker, Magnolias.

Deftones’ private music #

I'm not really a Deftones fan but on each of their albums there's always a couple of songs that hook me and become part of my regular rotation. However, when I first listened to my mind is a mountain, its energy and crisp, unique sound captivated me and made me excited to dig into the entire record. And the rest of the album is a fantastic mix of unique guitar riffs, tight and interesting drum rhythms, and Chino Moreno's one-of-a-kind vocals. I've been spinning this one a lot ever since it came out. Favourites: my mind is a mountain, locked club, milk of the madonna.

Dream Theater’s Parasomnia #

The band's first album since Mike Portnoy's momentous return to the lineup, and exactly what I needed; their previous album A View From The Top Of The World did almost nothing for me. As expected, Portnoy's return meant an injection of a different type of energy that, as much as I really like previous drummer Mike Mangini, I feel the band needed, to get a good shake up. A mostly heavy concept album exploring various terrors of the night, Parasomnia is a blast all the way through. The album artwork/cover is terrible, though. Favourites: A Broken Man, Dead Asleep (the main riff is killer!), Bend the Clock, The Shadow Man Incident.

Darren Korb’s Hades II: Original Soundtrack #

As far as I'm aware, Darren Korb is a musical god. That he can put together this immense collection of tracks that explore and melt together different styles and soundscapes while keeping it consistent throughout with satisfying leitmotifs and insanely great ear-worms, is nothing but an insane display of musical prowess. All the Skylla and The Siren songs are bangers. Favourites: Coral Crown, King Vermin, (Thrashing) Into Tartarus, The Necropolis, Rock and a Hard Place, Bewitching Eyes, The End Of Time.

Honourable mentions: Bad Bunny’s Debí Tirar Más Fotos; Lorien Testard’s Clair Obscur: Expedition 33 Original Soundtrack, Between The Buried And Me's The Blue Nowhere.

Cinema #

One Battle After Another #

Amongst my favourites from Paul Thomas Anderson and might be my actual favourite film of the year. Surprisingly funny at times, but mostly dark, tense, frantic and filled with memorable characters and tremendous, heart-pumping moments.

Train Dreams #

This one felt to me like it came out of nowhere but it immediately captivated me and wrecked me when it ended. An absolutely beautiful film where every frame could very well be a painting.

Sinners #

Another visual stunner where music is a protagonist. I still think about that scene with the "music incantation" during the party; a visual and musical spectacle that makes the entire experience worthwhile.

Wake Up Dead Man #

Might be my favourite entry in the wonderfully brilliant Benoit Blanc/Knives Out series. A visual delight, an impossible crime, a great and super fun cast, and super engaging performances to tie it all together. Rian Johnson keeps on delivering jewels.

Honourable mentions: Weapons, 28 Years Later, Predator: Killer of Killers; KPop Demon Hunters, Bugonia, Frankenstein.

TV #

Pluribus #

More Vince Gilligan and Rhea Seehorn was all I needed to know, to show up for this. And it delivered exactly what I expected: an astonishing performance carrying a slow burner, methodical, and engaging mystery that ends up asking some interesting questions about humanity, loyalty, individuality, and community.

Andor Season 2 #

An ground-breaking political thriller that happens to be set in the Star Wars canon and therefore makes arguably the best piece of Star Wars-anything in a long time. Simultaneously, it felt like a warning for how authoritarianism creeps in and how it crumbles.

Adolescence #

Jaw-dropping in every sense. A technical wonder and a galore of tour de force performances, all presenting a real-life, deeply troublesome epidemic.

Honourable mention: Severance Season 2, Alien: Earth.

Games #

Clair Obscur: Expedition 33 #

The best modern version of what classic Final Fantasy would be if made today. Full of charm, with a fascinating setting, a tragic and engaging story, multi-dimensional characters, a ridiculously fun and super challenging combat system, and unbelievably great music. It's the whole package.

Hades II #

Alongside the previous Hades, these are only action rogue-like games I really like, and it's doubtlessly all thanks to that Supergiant Games' phenomenal combo of superb writing and flawless presentation.

Death Standing 2: On The Beach #

An extremely polished, massive-budget, high-production experience overflowing with its auteur's idiosyncrasies. There's a lot of crazy, wild, convoluted stuff going on here, but it's done with such earnest and polish that I could't help but love it. The freedom and possibilities provided by the gameplay mechanics makes every playing moment deeply engaging and rewarding. Hideo Kojima did it again.

Öoo #

This one came out of nowhere and quickly became one of the year's highlights for me. It's a puzzle platformer where you cannot actually jump; instead, you propel yourself by setting off the self-generating bombs that up your body (the "oo" in the games title!). It's a compact, tight, charming, and super satisfying brain-tickler of an experience.

The Roottrees Are Dead #

An investigation game - which my wife and I loved playing together - where you must figure out a huge family tree and all of their history and inherent drama. Some of the deduction mechanics reminded me of Obra Dinn, and the in-game internet was very fun to explore. All in all, it's a brilliant mystery that's highly satisfying to uncover.

Dispatch #

Another year highlight that I played together with my wife. It’s almost spotless, but it might just be that the plot, characters and their relationships and evolution is so, so sharply and hilariously written and presented, that at times I just wanted to get over the gameplay bits (which were still fun!) to see how it would all progress. Absolutely brilliant.

Honourable mentions: Bionic Bay, Sword Of The Sea,

New music: "Kindness Inspires Radical Actions Neverendingly"

2026-01-17T00:00:00Z

Listen and buy it on Bandcamp (all money donated to Cycle For Good!).
Original song in Strudel.

A month ago I released Kindness Inspires Radical Actions Neverendingly on Bandcamp, but I hadn't written about it until now.

This is the second song I've written in Strudel (here's my post about the first one). It's inspired by a very good friend of mine and I made it as a birthday gift to him. I released it on the day of my friend's 50th birthday party.

Any and all money made from the song in Bandcamp goes to the non-profit organisation he co-founded, Cycle For Good.

Here's the source code for the song:

// "Kindness Inpires Radical Actions Neverendingly"

setcpm(50/2)

const drumbank = "tr909";
const scale = "g:major";

const masks = {
  // DRUMS
  kck: "<[0 1] 1 1 1 0 1 1 1 1 [1 1 1 [1 0]] 0>/8",
  snr: "<0 [0!8 1] 1 1 0 [0!8 1] 1 1 1 [1 1 0 0] 0>/8",

  bss: "<1 1 1 1 1 1 1 1 1 1 0>/8",

  clp: "<0 1 1 1 0 0 1 1 1 [1 1 1 0] 0>/8",

  hat: "<0 0 0 0 0 0 1 1 1 [1 1 0 0] 0>/8",
  
  tf0: "<0 0 0 0 0 [0!7 1] 0 0 0 [0] 0>/8",
  tms: "<0 0 0 0 0 0 0 0 1 [1 1 [1 0] 0] 0>/8",
  
  cra: "<0 0 [1 0!7] 0 0 0 [1 0!7] 0 0 [0] 0>/8",

  // SYNTHS
  ld0: "<0 1 0 0 0 1 0 0 0 [1 1 0 0] 0>/8",
  ld1: "<0 0 1 1 0 0 1 1 1 [1 1 0 0] 0>/8",
  ld2: "<0 0 0 1 0 0 1 1 1 [1 0 0 0] 0>/8",
  ld3: "<0 0 0 0 0 0 0 0 1 [1 1 1 0] 0>/8",
  
  md1: "<0 0 0 0 1 1 1 1 1 [1 1 0 0] 0>/8",
  md2: "<0 0 0 0 0 1 1 1 1 [1 1 0 0] 0>/8",

  // BASS
  bs2: "<0 0 0 0 0 0 1 1 1 [1 1 1 1] 0>/8",
  bs3: "<0 0 0 0 0 0 0 1 1 [1 1 0 0] 0>/8",
  bs4: "<0 0 0 0 0 0 0 0 1 [1 1 0 0] 0>/8",

  // EXTRAS
  pho: "<0 0 0 0 0 0 0 0 1 [1 1 1 0] 0>/8",
  cow: "<0 0 0 0 0 0 0 1 1 [1 1 0 0] 0>/8"
}

/////////// DRUMS

$kick: s("bd*4").bank(drumbank)
  .mask(masks.kck)
  .color("cyan")._scope();

$clap: s("[~ cp]!2").bank(drumbank)
  .room(.7)
  .gain("<.9!2 1.2!9>/8")
  .mask(masks.clp);

$snare: s("sd!16?".degradeBy(.6).ribbon(19,2))
  .room(.3)
  .bank(drumbank)
  .mask(masks.snr)
  .gain(1.1)
  ._punchcard();

$white: s("white!4").att(.4).gain(.2).mask(masks.kck);

$hat: s("[~ oh]!4").bank(drumbank).delay(.5).gain(.55)
  .mask(masks.hat)
  .color("yellow")._scope();

$toms_fill: s("mt lt").struct("- - x x x x x - - x x - - - - -")
  .pan("0 1")
  .gain(.7)
  .mask(masks.tf0);

$toms: s("mt lt").struct("- - x x - x - x - - x x - - x x ")
  .pan(sine.slow(2))
  .bank(drumbank)
  .gain(.3)
  .mask(masks.tms)._scope();

$crash: s("cr").bank(drumbank).att(.4).decay(2).room(3).rsize(3).gain(.2)
  .mask(masks.cra);

/////////// SYNTHS

const lead = "<9 8 4 1 7 5 0 1>*16";

$lead0: note(lead).scale(scale).sound("supersaw")
  .gain("<.25 .3 .4 .5 .6 .7 .8 .9>")
  .mask(masks.ld0)
;


$lead: note(lead).scale(scale).sound("supersaw")
  .gain(.75)
  .mask(masks.ld1)  
  ._punchcard();

$lead2: note(lead.add(14)).scale(scale)
  .sound("supersaw").delay(.5).gain(.4).mask(masks.ld2);

$lead3: note(lead.add(9)).scale(scale)
  .sound("supersaw").gain(.4).mask(masks.ld3);

const melody = "<[5 [3 4] 0 4] [3 [4 5 6 8] 7 [11 12 11 9]] [8 [4 6] 7 8] [9 11 7 _]>*.5";

$lead_hb: n(melody).scale(scale).s("supersaw")
  .dec(1000).gain(.7)
  .mask(masks.md1)._punchcard();

$lead_hb_a: n(melody.add(2)).scale(scale).s("supersaw")
  .gain(.5)
  .mask(masks.md2);


/////////// BASS

$bass: n("<8 9 [4 1] <7 0>>".add(-14)).scale(scale).s("supersaw")
  .gain(1.3)
  .mask(masks.bss).color("magenta")._punchcard();

const bassHits = "0!16?".degradeBy(.6).ribbon(19,2).add("<1 2 [4 1] 0>");

$bass2: n(bassHits).scale(scale).s("supersaw")
  .trans(-12).gain(1.4)
  .mask(masks.bs2)._punchcard();
           
$bass3: n(bassHits).scale(scale).s("supersaw")
  .room(1).gain(1.2)
  .mask(masks.bs3);

$bass4: n(bassHits.add(2)).scale(scale).s("supersaw")
  .room(1).gain(1)
  .mask(masks.bs4);

//////// EXTRAS

$phone: n("<9 8 4 1 7>*4").scale(scale).s('gm_vibraphone')
  .pan(rand)
  .gain(.3)
  .mask(masks.pho)._punchcard();

$cow: s("cb").struct("- - - x x x x x - - - - - - - - ")
  .bank("viscospacedrum")
  .gain(.25).room(.5).pan(rand)
  .mask(masks.cow);

I'm very proud of this one! I hope you give it spin, enjoy it, and dance to it! (And even better, buy it for a good cause!).

Bonus: here's an earlier, less polished, incomplete version of the song.

A Shower Of Thoughts / Bernardo Baquero Stand

My 2017's Lists and Numbers

Traveling #

Concerts #

Music #

Films #

Games #

Finished: #

Played #

Highlights of 2017 #

Reeddit, 6 Years Old

My List and Numbers of 2018

Places #

Concerts #

Films #

Games #

Music #

Work #

Other #

New song from Tool

Firefox Add-Ons that should be built into the browser already!

Containers #

Snooze Tabs #

Side View #

Apple Arcade is fantastic. Mostly.

Favourite games so far #

Satelite beta

Satelite #

Why though? #

What's new? #

Feedback, please! #

Issues with HDMI, Apple's USB-C dongle, and my MacBook Pro.

Solution #

useDelayedDebounce react hook

useDelayedDebounce.ts #

Usage Example #

The best from last-gen consoles; screenshots, video captures, and photo mode.

Quickly toggle Dark Mode on macOS via Automator

More iPad, less MacBook

Easier dark-mode CSS with Sass

The setup #

The Sass Mixin #

Limitations: can't be used for root/html styles #

The future: simpler implementation #

ZapKeys

Try it now #

What it does: a different approach to shortcuts #

How it works #

The easiest setup #

Years in the making #

Album Whale

Revisiting The Last Of Us Part II

Best Of 2024

Games #

1. Like A Dragon: Infinite Wealth #

2. Astro Bot #

3. Prince Of Persia: The Lost Crown #

4. UFO 50 #

Films #

1. Dune: Part Two #

2. Inside Out 2 #

3. Challengers #

4. Alien: Romulus #

Music #

1. Blood Incantation's Absolute Elsewhere #

The year of King Gizzard And The Lizard Wizard #

TV Shows #

They announced the Switch 2, finally

Sticker-bombing my laptop

First attempt #

Doing it right ♪ #

The result #

Everywhere now #

Next To-Do: a Shortcut for your next task in Reminders.app

Preventing race conditions between sibling htmx elements with `hx-sync`

How I solved it #

The Switch 2

Disable scrolling for a modal dialog: my first use of CSS `:has`

The dialog element as a modal #

Modal dialog does not prevent page-scrolling #

`useDelayedDebounce.ts` #

The `dialog` element as a modal #

Modal `dialog` does not prevent page-scrolling #

`:has()` as a "global observer" #