Hugo

Started using jules.google.com

Async development agent, you grant it access to GitHub repositories, it clones them in a VM and runs tasks (including scripts etc).

Not bad for small tasks, stubbing/poc attempts or while on the go (slow to type code on mobile).

Also pre-TypeScript libraries that do a bunch of runtime parameter validation

I'm reviving my newsletter, have ~2 months of content scheduled.

Subscribe if you think this content might interest you.

buttondown.com/hugo/

Big news! I'm available for hire! If you have JavaScript/TypeScript you want written, and you have budget for an ambitious and highly skilled practitioner with over 20 years of experience doing that, including leading teams, communities, and execs, hit me up.
izs.me
(RT please)

Code with Hugo: JS & Node.js in Prod Subscribe for content about: TypeScript Node.js Test Runner Past focuses: The Jest Handbook Alpine.js Guides A weekly newsletter covering web technologies and developer tools with a particular foc...

If you prefer it to your email inbox, I'll be sending them out

Subscribe at buttondown.com/hugo#subscri...

I've aggregated some more advanced/non-obvioud TypeScript patterns in this new posts

codewithhugo.com/typescript-t...

Also found supademo.com/tools/screen...

To add annotations in the padding space to make the images pop a bit more

Was struggling to find a free product screenshot generator for Alpine Devtools Chrome extension

For the Chrome Webstore you need to capture 1280x800 and I'm just not that accurate with drag and drop

screenshot.rocks seems to do the basics of what I need (browser frame config, padding/background)

Aaaand just noticed it's not responsive

I've got a plan to move alpine.codewithhugo.com over (which is 11ty) so will likely redo at that point

Interesting concept of a minimalist blog

ostwilkens.se/blog/setting...

To be honest for alpinedevtools.com/updates

I went even further: use .md files and generate the HTML using the VSCode Markdown All In One plugin.

Funny story

I keep hitting this "I want to select elements where attr starts with *prefix*"

Eg. Detect HTMX I need hx-* or data-hx-*

GitHub diff adding Tailwind dark: classes to support dark mode

I'm not one to admit when I'm being stubborn

But working on the Alpine Devtools in the evenings means I finally felt the "why no dark mode" pain

This vindicates the time I spent wiring Tailwind (v4) properly the other day (devtools v1 is on Tailwind 1)

Alpine.js Devtools Workflow Survey This short 6-question survey will help me prioritise features and explore ways to make Alpine.js Devtools more sustainable. If you use Alpine.js Devtools, I’d love your input! (I'm collecting emails t...

What's next?

- time travel debugging (store data updates and re-apply them)
- improvements to component/data edit UX

Let me know your workflow/features you need: alpinedevtools.com/survey

Early Access (paid) features, see alpinedevtools.com/pricing (launch discount!)

- Alpine v3 stores inspect/data edit
- Alpine v3 eval warnings
- jump to source in elements tab for eval errors and components

Free Extension (re)available on Chrome webstore:

- manifest v3 compatible (rewrite to @solidjs.com)
- component inspect/data edit
- performance fix for larger components (instant updates, tested on 10k data properties)
- state/sync reload fixes (no more close/reopen, works on page refresh etc)

Live/(re)launched alpinedevtools.com

Over the past few weeks.

One of the first times I've ever been bitten by Big O

```
data.map((d) => {
prevState = oldData.reduce()
})
```

When data and oldData are ~10k entries, you're doing a 100 million iterations.

Move the reduce out of the loop (.map here) and you're doing 20k...

No build Tailwind

- use `@tailwindcss/browser` via CDN (but only on local) in your app
- run `copy(document.querySelector('style').innerText)` (depending on whether you've got other styles you might need to mess with the selector)
- paste into your .css file

So here's the deal:

- rewrite the panel with SolidJS
- launch paid early access (components features available now, stores in the next release)

Early access available at: github.com/sponsors/Hug...

Alpine.js devtools early access extension in the Chrome Web Store

Trying something new (or maybe reviving an old project)

I was part of the original crew that worked on Alpine devtools.

Chrome has obsoleted the extension (granted, it has had no updates since Sept 24) with Manifest v3

Using Windows as a dev machine (temporarily) professionally for the first time after ~ a decade of being on Mac

I started leaning into the IDE to run things, shell is just a minefield with backslash in paths, slow and bad auto complete

Keyboard navigation muscle memory for VSCode letting me down

That looks awesome

MacBook Air M1 -> remote desktop via Citrix
I guess will sip battery?

codewithhugo@next Welcome to the 96th Edition of the Code with Hugo newsletter. A lot has happened since I was regularly sending this out. This is still a place to learn about...

buttondown.com/hugo/archive...

I'm changing jobs in the new year so there may be a set of new posts about what the job search was like this time round

Buttondown, which powers the newsletter has changed pricing tiers (stopping my send) and UI (hiding away a setting Ineed to toggle) let's see when the newsletter makes it out.

GitHub - HugoDF/node-test-runner-examples: Examples of tests using the `node:test` module and runner Examples of tests using the `node:test` module and runner - HugoDF/node-test-runner-examples

super excited about new Node.js features: I have test runner examples and a post about env file management

github.com/HugoDF/node-...

codewithhugo.com/load-env-var...

As I look forward to 2025, here's some recent things I've been up to:

Published JavaScript Design Patterns with Packt: www.amazon.co.uk/Javascript-D...

My take on design patterns in JS (you can, but should you?). As well as other types of patterns in architecture and building JS applications

Been trying to get my first newsletter issue in a while sent out, more on that at the end of the thread

A lot has happened since I was regularly sending this out. I'm intending for it to still a place to learn about JavaScript/TypeScript and Node.js in the real world.

Good to be here!

Another thing that I've seen BFFs do is aggregate/transform multiple "service" responses (something that filtering in the API tier wouldn't fix)