Code_E_Pendant
LightNews LightNews
banner
code-e-pendant.bsky.social
Code_E_Pendant
@code-e-pendant.bsky.social
310 followers 250 following 140 posts
Full stack engineer, founder, rustacean, and WEEB.
Posts Replies Media Videos
code-e-pendant.bsky.social
Finally added prop-binding syntax to Thunderous. I had my reservations because I think conflating props and attrs tends to cause a lot of confusion, but I think this compromise (inline with HTML, but distinct from attrs) adds a lot of value.

(Building a to-do app magnified the pains 100x.)
A code snippet comparing the old way to set element properties, versus the new way. You used to have to select the element (whether from refs or otherwise) in the connected callback, then manually set the property like old-school JS. Now you can bind directly in the HTML templates using a special prop-colon syntax.
April 30, 2025 at 9:35 PM
code-e-pendant.bsky.social
Was actually checking that out! Considered adding as a dependency to my package, but I need more control over the template.

So... If client, do the usual portal thing. If not client, check dsd support, which can only be done on the client... maybe I misunderstood the useSyncExternalStore hook.
A snippet of code from the internals of the @declarative-shadow-dom/react package
December 6, 2024 at 11:40 PM
code-e-pendant.bsky.social
Hey, I don't want this
non-passing CI pipeline because of Vercel
December 6, 2024 at 4:08 AM
code-e-pendant.bsky.social
You can now add stronger types for properties in Thunderous!
www.thunderous.dev/docs/propert...
code demonstrating the "count" property as a type generic, providing the type "number" for the signal.
November 18, 2024 at 11:50 PM
code-e-pendant.bsky.social
This just got even easier, after adding custom callbacks!

codepen.io/Jon-DeWitt/p...
const MyElement = customElement(({ customCallback }) => { const [count, setCount] = createSignal(0); const increment = customCallback(() => setCount(count() + 1)); return html` <button onclick="${increment}">Increment</button> <output>${count}</output> `; });
October 12, 2024 at 6:49 PM
code-e-pendant.bsky.social
Are we still talking about web components? Cause I was inspired to reduce the boilerplate with a functional syntax + signals!

Live playground: codepen.io/Jon-DeWitt/p...
const MyElement = customElement(({ attrs, refs, connectedCallback, }) => { const [count, setCount] = createSignal(0); connectedCallback(() => { refs.increment.addEventListener('click', () => { setCount(count() + 1); }); }); return html` <h1>${attrs.heading}</h1> <button ref="increment">increment</button> <output>${count}</output> `; }); customElements.define('my-element', MyElement);
October 8, 2024 at 11:31 PM
code-e-pendant.bsky.social
It's healthier to focus on the common ground
September 29, 2024 at 2:17 AM
code-e-pendant.bsky.social
Well, first 2 million, that counts for something right?
September 18, 2024 at 1:18 AM
code-e-pendant.bsky.social
if you see this you have to post a picture from your phone but don't explain it
June 30, 2024 at 12:54 AM
code-e-pendant.bsky.social
Move over ex-googlers, I uploaded anime
Anime profile picture always has the most unfathomable skills.
June 21, 2024 at 1:58 PM