AngleScript

AngleScript is a lightweight online editor for HTML, CSS and JavaScript that I built with React in 2021. You write code in three panes and see the result render live underneath, without touching the project you're actually working on. You can try it at gaganbiswas.github.io/anglescript, and the code is on GitHub.

What it's for

It's handy for trying out a small snippet before putting it into a real project, so you can catch bugs in a few lines of code without breaking the app around them. Because the output renders live, it also works for coding interviews.

How it works

Each pane is a CodeMirror editor with line numbers, line wrapping and auto-closing brackets and tags, and any pane can be collapsed to give the others more room. Whatever you type is saved to local storage, so it's still there when you come back.

The preview is a sandboxed iframe. About 800ms after you stop typing, the HTML, CSS and JavaScript get stitched into a single page and loaded into it, so your scripts run in isolation from the editor itself.

What doesn't work yet

It's built for desktop and isn't responsive, so it's hard to use on a phone. If you'd like to help with that or add something else, get in touch.