twick

twick

AI-powered video editor SDK built with React. Features canvas timeline, drag-and-drop editing, AI captions, and serverless MP4 export. Perfect for building custom video apps.

Stars: 206

Visit
 screenshot

Twick is a comprehensive video editing toolkit built with modern web technologies. It is a monorepo containing multiple packages for video and image manipulation. The repository includes core utilities for media handling, a React-based canvas library for video and image editing, a video visualization and animation toolkit, a React component for video playback and control, timeline management and editing capabilities, a React-based video editor, and example implementations and usage demonstrations. Twick provides detailed API documentation and module information for developers. It offers easy integration with existing projects and allows users to build videos using the Twick Studio. The project follows a comprehensive style guide for naming conventions and code style across all packages.

README:

Twick

A comprehensive video editing toolkit built with modern web technologies.

Style Guide

This project follows a comprehensive style guide for naming conventions and code style across all packages. Please refer to STYLE_GUIDE.md for detailed standards.

Overview

Twick is a monorepo containing multiple packages for video editing functionality:

CI Deploy Documentation

This repository contains a collection of packages for video and image manipulation, built with modern web technologies.

Packages

  • @twick/media-utils: Core utilities for media handling and manipulation
  • @twick/canvas: React-based canvas library for video and image editing
  • @twick/visualizer: Video visualization and animation toolkit
  • @twick/live-player: React component for video playback and control
  • @twick/timeline: Timeline management and editing capabilities
  • @twick/video-editor: React based video editor
  • @twick/examples: Example implementations and usage demonstrations

For detailed API documentation and module information, refer to docs/modules.md.

Getting Started

  1. Clone the repository:
git clone https://github.com/ncounterspecialist/twick.git
cd twick
  1. Install dependencies:
pnpm install
  1. Build all packages:
pnpm build

Development

Each package can be developed independently:

# Build a specific package
pnpm build:media-utils

Examples

Running the Demo

pnpm preview

Open http://localhost:4173 in your browser to see the video editor in action.

For detailed examples and tutorials, see the Twick Demo guide.

Demo Preview

Here is a glimpse of building a video using the Twick Studio:

https://youtu.be/EizgeoxwJsk

It is so easy to integrate twick to your existing project https://youtu.be/2M6vtOHZnEI

Integration

Video Editor Integration

  1. Install Dependencies
npm install --save @twick/canvas @twick/live-player @twick/timeline @twick/video-editor @twick/studio
  1. Add Twick Studio component with LivePlayer and Timeline Context as shown
import { LivePlayerProvider } from '@twick/live-player';
import { TimelineProvider } from '@twick/timeline';
import "@twick/studio/dist/studio.css";
import { INITIAL_TIMELINE_DATA } from "@twick/video-editor";

export default function ExampleStudio() {
  return (
    <LivePlayerProvider>
      <TimelineProvider
        initialData={INITIAL_TIMELINE_DATA}
        contextId={"studio-demo"}
      >
        <TwickStudio />
      </TimelineProvider>
    </LivePlayerProvider>
  );
}

Documentation

  • Twick Documentation: Twick API Documentation – Comprehensive documentation and API reference for all Twick packages.
  • Style Guide: Style Guide – Guidelines for coding standards and best practices.
  • Demo Guide: Twick Demo Guide – Step-by-step tutorials and interactive examples.

Community

Join our Discord community to:

  • Chat with other developers
  • Discuss issues and feature requests
  • Get help and share your experiences
  • Stay updated with the latest developments

Join our Discord Server

License

This project is licensed under the Sustainable Use License (SUL) Version 1.0.

  • Free for use in commercial and non-commercial apps
  • Can be modified and self-hosted
  • Cannot be sold, rebranded, or distributed as a standalone SDK or developer tool

For resale, or SaaS redistribution please contact us.

For full license terms, see LICENSE.md.

For Tasks:

Click tags to check more tools for each tasks

For Jobs:

Alternative AI tools for twick

Similar Open Source Tools

For similar tasks

For similar jobs