We built Qwik City on rock and roll

Today’s issue: Fun things you can do with commas in JavaScript, a scary bridge in Missouri, and the hottest JavaScript trend of the season.

Welcome to #163

---

We built Qwik City on rock and roll

The hype train picked up more steam last week when Qwik City released server functions. Now I know what you’re probably thinking…

Wtf is Quick City? It’s an unincorporated community in rural Missouri with a very old bridge that’s definitely haunted.

Qwik City, on the other hand, is a metaframework built on top of the Qwik framework that provides routing and data-fetching. You can think of it as the Next.js of Qwik. Like 🧢, “server functions” can mean a lot of different things now days. As far as this release is concerned, there are two of it – loaders and actions.

loader$ gives you low-latency data fetching that’s fully reactive across the server and browser. It’s similar to Next’s getServerProps and Remix’s… loaders, but with a couple unique advantages:

• Zero-effort type safety — These server loaders are just exported functions, so they bring their type information with them. That means if you’re using TypeScript on the client and the server, you never need to manually specify your types.

• Colocation — Loaders can be located anywhere and referenced or imported from any file, bringing their types and data to the party too.

action$ let you execute code on the server for user interactions like form submissions and sign-ins. They also make it easy to create a form endpoint just by creating a new function, and come with built-in validation and Zod support. This is yet another win for — you guessed it — the type nerds.

We also saw a cool demo for server$, which it about the easiest way I’ve ever seen to execute a server function. It doesn’t seem available quite yet (we think?), but we’re looking forward to playing with that black magic once it is.

Bottom Line: Qwik’s talked openly about how it wants to give developers best-in-class performance and best-in-class DX. And as someone who has always enjoyed having my cake and eating it too, I’m hoping they can pull it off.

---

Brilliant gives you big brain energy

Oh nice, you’ve got a little downtime while your code compiles.

Time to dive down the bottomless TikTok rabbit hole? Or play a fun game of Looking up your Ex? Not today, Satan.

It’s time to check out Brilliant’s bite-sized lessons on math, data, and CS. They make it easy (but not too easy) to master serious subjects in just a few minutes per day. Here’s how:

• They have thousands of lessons on tons of topics — from calculus and linear algebra, to AI and neural networks.

• They break down complex concepts into digestible building blocks that stick.

• Their interactive style keeps you engaged, so it’s easy to build a daily habit.

Look, I’m not trying to go all “David Goggins” on you here — but we both know that we’d benefit from some more proactive learning time.

And right now, you can try everything Brilliant has to offer for free for a full 30 days. Plus, Bytes readers get 20% off an annual premium membership.

---

In the code snippet below, what do a and b evaluate to?

let a = 0;
const b = [1, 2, 3, 4, 5].map((x) => (
  (a += x), x * x
));

console.log(a) // ?
console.log(b) // ?

---

1. The fans demanded a sequel, so Andy Jiang and Bartek Iwańczuk wrote Roll your own JavaScript runtime, Pt. 2 for the Deno blog. This one’s a lot darker than the original, but it’s nice to see the franchise evolve.

2. FusionAuth created a simple auth solution that’s built by (good) devs, for (good) devs. [sponsored]

3. Miško Hevery wrote about how useSignal is the Future of Web Frameworks. I’ve heard rumors that he lives under that bridge in Quick City, Missouri — but that’s ridiculous. He just works from there.

4. Right on cue, Angular just opened up their first PR for exploring fine-grained reactivity with signals. Because Signals is apparently the hottest trend since those giant red cartoon boots all the influencers wear.

5. Promptable is an experimental library for building “full-stack AI apps” with JavaScript and TypeScript. Not to be confused with “TakeYourJobAndMakeYouIrrelevantable” which is something similar we’ve been working on in the AI/TypeScript space.

6. CodeSandbox just announced Sandpack 2.0 that comes with a Node.js runtime that can run in any browser.

7. So, you want to build an app that has its data co-located with its UI? That works offline? That synchronizes between clients? And that lets its users own their data? This reads like an ad, but we just copied it from localfirstweb.dev – a site with resources on… “local-first web development”.

8. This blog post was originally published in 2015 under the title “React for Stupid People”. We like that title better. But regardless, it’s fun to look back on one of the first viral React posts.

---

In the code snippet below, what do a and b evaluate to?

let sum = 0;
const squares = [1, 2, 3, 4, 5].map((x) => (
  (sum += x), x * x
));

console.log(sum) // 15
console.log(squares) // [1, 4, 9, 16, 25]

This is a fun one. The weirdest part is probably the comma , operator.

If you’re not familiar, , evaluates each of its operands (from left to right) and returns the value of the last operand. This allows us to, in a single line, increase sum by x and return the square of x. When finished, we get the sum of the array as well as a new array of squares.