Scratchpad JS: the index

#typescript #javascript #webdev #beginners

For two weeks, this series has been one idea a day: a JavaScript or TypeScript technique small enough to try in a scratch file, explained well enough to use at work. Here's all of it, grouped by what you're trying to do. The series box above links every post.

"What is this value?"

#1 Inspect any value without console.log: the console.log(x) || x trick, a tap helper, and when to just split the chain.
#2 Log inside a loop without touching the code: conditional logs, console.table, console.count and logpoints.
#9 Quick data munging: Object.groupBy, a real CSV parser, and the date bug that moves Monday to Sunday.

"Why did it break?"

#7 Reading a stack trace that points at your own line: read it top down, throw Errors, name functions, wrap with cause.
#6 TypeScript types you can see running: why as lies, and how type guards, assertion functions and satisfies put checks back.
#11 What your TypeScript becomes when it runs: what's erased, what's emitted, and erasableSyntaxOnly.

"Will this work there?"

#5 The same snippet in Bun and in a browser: the portable core, feature detection, and detecting once at the edge.
#10 Prototype an API call before you write the client: tokens from the environment, timeouts, res.ok, rate limits.

"Can I just try it?"

#3 Try a React component without creating a project: a useDebouncedValue hook, tested in one file.
#8 Canvas sketches with no build step: Retina-sharp pixels, delta time, and fading trails.
#4 Refactor with a local model, and review it as a diff: pin behaviour with console.assert, then read the diff.

"Make me faster"

#12 Multi-cursor moves that replace a regex: split into lines, select next, column cursors.
#13 A week of JavaScript tips, collected: at, toSorted, structuredClone, Object.groupBy and friends.

Why a scratchpad

Every post ended the same way: here's the technique, now try it. That's because a technique you've run once sticks in a way that one you've read about doesn't. And trying it should take seconds, not a project.

That's the idea behind JSLab, the JavaScript & TypeScript scratchpad for macOS that every example in this series was run in: open a tab, type, and every result shows up beside the line that produced it.

It launches tomorrow, Nov 15. The docs are already up: https://js-lab.app/docs

DEV Community