Declarative animated syntax highlighter
Automatically turn code snippets into step-by-step animations for the web
Why?
Presenting code in this way (for eg. a coding tutorial, a presentation or in tools for developers) makes changes easy to follow. Also animations look nice, are easy to create, and work reliably without any dependencies.
How?
Frames of code are run through a semantic diffing algorithm and the resulting deltas get turned into animation information … and finally into bog-standard HTML and CSS. No runtime JS required!
Go!
Code.Movie ist just JavaScript library that's fast enough to run in web frontends, but also works server-side. Grab it from NPM or a CDN, add it to your project, skim the tutorial, done!
Beware: this is a work in progress!
Expect bugs, breaking changes, missing features, a lack of supported languages and terse (if any) documentation! This only affects the JavaScript library; animations, once generated, will keep working forever.
Latest update: Strings were a mistake
Most programmers know to avoid working with dates and time, but strings are even worse!