DEV Community

Ceco Gatev
Ceco Gatev

Posted on

Browser one-liners that replace a bunch of online dev tools

#productivity #webdev #javascript #beginners

Half the "online tools" I used to Google are one line of built-in browser JS. Keeping these in your head (or a snippet file) saves a tab and keeps your data off random servers.

Random UUID (v4) 

crypto.randomUUID(); // "9b1deb4d-3b7d-4bad-9bdd-2b0d7b3dcb6d"
Enter fullscreen mode Exit fullscreen mode

Cryptographically random, built in. For bulk, just loop it.

HEX → RGB 

const [r,g,b] = hex.match(/\w\w/g).map(h => parseInt(h,16));
Enter fullscreen mode Exit fullscreen mode

URL encode / decode (the right one) 

encodeURIComponent(value); // a single query value
encodeURI(fullUrl);        // a whole URL, keeps / : ? & =
decodeURIComponent(s.replace(/\+/g,' '));
Enter fullscreen mode Exit fullscreen mode

Base64 (UTF-8 safe) 

btoa(unescape(encodeURIComponent(str)));   // encode
decodeURIComponent(escape(atob(b64)));     // decode
Enter fullscreen mode Exit fullscreen mode

The naive btoa(str) throws on emoji/accents — the wrap fixes it.

JSON validate + format 

JSON.stringify(JSON.parse(input), null, 2);
Enter fullscreen mode Exit fullscreen mode

JSON.parse is your validator (it throws with the position).

I got tired of pasting into sketchy sites, so I made no-signup, runs-in-your-browser versions of these — handy when you want a UI but don't want to ship your data anywhere:

What's the one "online tool" you reach for that's secretly a browser one-liner?

Top comments (0)