Skip to content

A react-based code animator that times your keystrokes out an a smooth fassion

License

Notifications You must be signed in to change notification settings

ntatko/code-input-animator

Repository files navigation

Code Input Animator

Code Input Animator is a simple web application that animates the typing of code snippets. It is built with React using Vite.

Instructions

Set up your code in the top box how you want the recording to start. You'll see your changes mirrored in the bottom box as you start.

Click the record button to start recording. You can pause and resume the recording as needed. When you're done editing your code, click the stop button.

You can then play back the recording by clicking the play button. You can also pause and resume the playback as needed. You'll use a screen recorder to capture the playback, so try to get as close to the green edges as possible, or be ready to do that in post.

Getting Started

To get a local copy up and running follow these simple steps.

Prerequisites

You will need Node.js and npm installed on your machine.

Installation

  1. Fork and clone the repo
  2. Install dependencies
   npm install
  1. Start the development server
    npm run dev
  1. Open your browser and navigate to http://localhost:3000

Contributing

If you would like to contribute, please fork the repository and submit a pull request. If you find a bug, please open an issue.

License

This project is licensed under the MIT License - see the LICENSE.md file for details.

About

A react-based code animator that times your keystrokes out an a smooth fassion

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published