AI Video Editor

An AI-powered video editing application that allows you to edit videos using natural language commands. Built with FastAPI, React, TypeScript, and Convex.

Features

• Natural Language Commands: Edit videos by simply telling the AI what you want to do
• Automatic Transcription: Whisper-powered speech-to-text with word-level timestamps
• Smart Video Editing: Cut, trim, add captions, and remove filler words
• Platform-Optimized Export: Export videos for TikTok, YouTube, LinkedIn, and more
• Real-time Collaboration: Work on videos with your team in real-time (future feature)
• Modern UI: Beautiful, responsive interface built with React and Tailwind CSS

Tech Stack

Backend

• FastAPI: High-performance Python web framework
• Convex: Real-time database and backend functions
• Whisper: OpenAI's speech recognition model
• FFmpeg: Video processing and manipulation
• OpenAI: Natural language processing for command parsing

Frontend

• React 18: Modern React with hooks and concurrent features
• TypeScript: Type-safe JavaScript
• Vite: Fast build tool and dev server
• Tailwind CSS: Utility-first CSS framework
• Zustand: Lightweight state management
• React Query: Server state management
• Video.js: Video player component

Quick Start

Prerequisites

• Node.js 18+ and npm
• Python 3.11+
• FFmpeg installed on your system
• OpenAI API key

Installation

1. Clone the repository

   git clone <repository-url>
   cd ai-video-editor

2. Install dependencies

   # Install root dependencies
   npm install
   
   # Install frontend dependencies
   cd frontend && npm install
   
   # Install backend dependencies
   cd ../backend && pip install -r requirements.txt

3. Set up environment variables

   # Copy backend environment file
   cd backend
   cp env.example .env
   
   # Edit .env with your API keys
   OPENAI_API_KEY=your_openai_key_here

4. Set up Convex

   cd backend
   npx convex dev --once

5. Start the development servers

   # From the root directory
   npm run dev

This will start:

• Frontend: http://localhost:3000
• Backend: http://localhost:8000
• Convex: https://ai-video-editor.convex.cloud

Usage

Basic Workflow

1. Upload a Video: Drag and drop or click to upload a video file
2. Wait for Processing: The system will automatically transcribe your video
3. Start Editing: Use natural language commands like:
   • "Find where they talk about fundraising"
   • "Remove all filler words"
   • "Cut from 1:30 to 2:00"
   • "Add captions with yellow text"
   • "Export as TikTok video"

Example Commands

Search Commands

• "Find where he talks about fundraising"
• "Jump to 2 minutes 30 seconds"
• "Search for technical features"

Edit Commands

• "Cut from 1:30 to 2:00"
• "Remove all ums and ahs"
• "Trim to first 60 seconds"
• "Keep only the introduction"

Style Commands

• "Add yellow captions, size 24"
• "Make captions bold and centered"
• "Add professional captions"

Export Commands

• "Export as TikTok video"
• "Make it vertical for mobile"
• "Export for LinkedIn"

Project Structure

ai-video-editor/
├── frontend/                 # React frontend
│   ├── src/
│   │   ├── components/       # React components
│   │   ├── stores/          # Zustand state stores
│   │   ├── services/        # API services
│   │   ├── types/           # TypeScript types
│   │   └── utils/           # Utility functions
│   └── package.json
├── backend/                  # FastAPI backend
│   ├── app/
│   │   ├── routers/         # API endpoints
│   │   ├── services/        # Business logic
│   │   └── config.py        # Configuration
│   ├── convex/              # Convex functions
│   └── requirements.txt
└── package.json             # Root package.json

API Endpoints

Video Management

• POST /api/upload - Upload video file
• GET /api/videos - List all videos
• GET /api/videos/{id} - Get video details
• DELETE /api/videos/{id} - Delete video

Transcription

• POST /api/transcribe/{video_id} - Start transcription
• GET /api/transcript/{video_id} - Get transcript
• GET /api/search/{video_id} - Search transcript

Editing

• POST /api/edit/trim/{video_id} - Trim video
• POST /api/edit/cut/{video_id} - Cut video segments
• POST /api/edit/captions/{video_id} - Add captions
• POST /api/edit/export/{video_id} - Export video

Chat

• POST /api/chat - Process natural language command
• POST /api/chat/execute/{video_id} - Execute command on video
• GET /api/chat/history/{video_id} - Get chat history

Development

Backend Development

cd backend
uvicorn app.main:app --reload --host 0.0.0.0 --port 8000

Frontend Development

cd frontend
npm run dev

Convex Development

cd backend
npx convex dev

Running Tests

# Backend tests
cd backend
pytest

# Frontend tests
cd frontend
npm test

Deployment

Production Build

# Build frontend
cd frontend
npm run build

# Build backend
cd backend
# (FastAPI doesn't need building)

Docker Deployment

# Build and run with Docker Compose
docker-compose up --build

Contributing

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

License

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

Acknowledgments

• OpenAI for Whisper and GPT models
• Convex for the real-time database
• FFmpeg for video processing
• The open-source community for all the amazing tools and libraries

Support

If you encounter any issues or have questions, please:

1. Check the Issues page
2. Create a new issue with detailed information
3. Join our Discord for community support

---

Built with ❤️ for the hackathon community