What it's made of...

RotoscodeJS is a set of tools that allow you to record as you code. Then, you can embed that recording to your websites.

Recorder Extension

The VSCode extension reponsible for recording your live code changes as well as generate the embed code.

Download now

Player Widget

The embeddable widget player that will render your recording on your websites.

Learn more

Open Source

The code for both the VSCode extension and player widget are publicly available on GitHub.

Recorder Extension Code Player Widget Code

How to use RotoscodeJS?

To use RotoscodeJS, you simply have to follow 2 steps: Record then, Embed!

Before you start, make sure you have the recorder extension installed to your VSCode instance.

RotoscodeJS VSCode Extension
RotoscodeJS Quick Demo
Step 1

Record

  1. In VSCode, open the command palette and search for "RotoscodeJS".
  2. Click the Start Recording button then wait for the countdown timer to wind down.
  3. Start coding!
  4. Click the Stop Recording button to end the recording session.
  5. Review the recording
  6. Click the Copy Code to copy the output code to the clipboard.
Step 2

Embed

Use the output code to embed the recording on your websites.

By default, the output code uses highlight.js. You can easily change this by including a different library and adjusting the onRender callback function.

Your code in motion.

RotoscodeJS is a set of tools that allow you to record as you code. Then, you can embed that recording on your websites.

Made by Kenneth Angelo Reyes
Design from Inovatik