Skip to main content

​
Overview

This guide walks you through setting up a complete development environment for contributing to the AI Video Presentation Generator project. This setup is more detailed than the basic installation guide and includes development tools, testing setup, and best practices.
This project currently supports Windows only for development. Linux/Mac support is in progress.

​
Prerequisites

Before starting, ensure you have:
  • Python 3.8+ installed
  • Node.js 16+ and npm
  • Git for version control
  • A code editor (VS Code recommended)
  • At least 4GB of free disk space

​
Initial Setup

1

Clone the Repository

First, clone the repository and navigate to the project directory:
git clone https://github.com/Kamal-Nayan-Kumar/AI-Video-Gen
cd AI-Video-Gen
2

Backend Environment Setup

Navigate to the backend directory and create a Python virtual environment:
cd backend
python -m venv venv
Activate the virtual environment:Windows:
venv\Scripts\activate
You should see (venv) in your terminal prompt.
3

Install Backend Dependencies

With the virtual environment activated, install all Python dependencies:
pip install -r requirements.txt
This installs FastAPI, Manim, MoviePy, and other required packages.
4

Install FFmpeg

FFmpeg is required for video processing:
  1. Download FFmpeg from https://ffmpeg.org/download.html
  2. Extract the archive to a location (e.g., C:\ffmpeg)
  3. Add the bin directory to your System PATH:
    • Open System Properties → Environment Variables
    • Edit the Path variable
    • Add C:\ffmpeg\bin (or your installation path)
Verify the installation:
ffmpeg -version
5

Install Manim

Manim should already be installed via requirements.txt, but verify:
manim --version
If not installed, run:
pip install manim
6

Configure Environment Variables

Create a .env file in the backend/ directory:
# Copy the example file
copy .env.example .env
Edit .env with your API keys:
# AI Content Generation
GEMINI_API_KEY=your_gemini_api_key_here

# Text-to-Speech
SARVAM_API_KEY=your_sarvam_api_key_here
SARVAM_TTS_URL=https://api.sarvam.ai/text-to-speech
SARVAM_MODEL=bulbul:v1

# Image Fetching
UNSPLASH_ACCESS_KEY=your_unsplash_access_key_here

# Server Configuration
HOST=0.0.0.0
PORT=8000
Never commit your .env file to version control! It’s already in .gitignore.
7

Frontend Setup

Open a new terminal, navigate to the frontend directory, and install dependencies:
cd frontend
npm install
This installs React, Vite, Tailwind CSS, and other frontend dependencies.

​
Running in Development Mode

​
Backend Server

In the backend/ directory with virtual environment activated: 
python app.py
The FastAPI server will start at:
  • API: http://localhost:8000
  • API Docs: http://localhost:8000/docs (Swagger UI)
  • Alternative Docs: http://localhost:8000/redoc
Use the /docs endpoint to test API endpoints interactively during development.

​
Frontend Development Server

In the frontend/ directory: 
npm run dev
The Vite development server will start at:
  • Frontend: http://localhost:5173

​
Hot Reloading

  • Backend: FastAPI auto-reloads on file changes when using uvicorn with --reload flag
  • Frontend: Vite provides instant hot module replacement (HMR)

​
Git Workflow

​
Branch Strategy

  1. Create a feature branch: 
    git checkout -b feature/your-feature-name
  2. Make your changes and commit regularly: 
    git add .
git commit -m "descriptive commit message"
  3. Push to your fork: 
    git push origin feature/your-feature-name
  4. Create a Pull Request on GitHub

​
Commit Message Guidelines

Follow conventional commits:
  • feat: add new animation type support
  • fix: resolve CORS issue in API
  • docs: update setup instructions
  • refactor: improve video composition logic
  • test: add unit tests for content generator

​
Testing Locally

​
Manual Testing

  1. Start both backend and frontend servers
  2. Open http://localhost:5173 in your browser
  3. Test the complete flow:
    • Enter a topic (e.g., “Quantum Computing”)
    • Set number of slides (3-10)
    • Choose language and tone
    • Click “Generate” and monitor progress
    • Preview the generated video
    • Download the final MP4

​
Testing API Endpoints

Use the Swagger UI at http://localhost:8000/docs to test:
  • /api/generate - Generate presentation
  • /api/progress/{generation_id} - SSE progress stream
  • /api/video/{filename} - Video streaming
  • /health - Health check

​
Checking Output Files

Generated files are stored in backend/outputs/: 
outputs/
├── audio/         # Generated voice narration
├── images/        # Fetched images from Unsplash
├── manim_code/    # Generated Manim Python code
├── manim_output/  # Rendered animations
├── scripts/       # Voice scripts with timestamps
├── slides/        # Individual slide images
└── final/         # Final composed videos

​
Development Tips

Add debug prints in the code or configure Python logging:
import logging
logging.basicConfig(level=logging.DEBUG)
During development, you may want to clear cached outputs:
# From backend directory
rm -rf outputs/*
Check terminal output for timing information:
  • Content generation time
  • Audio generation per slide
  • Animation rendering duration
  • Final video composition time
Vite proxy is configured to forward API requests to http://localhost:8000. Check vite.config.js if you change the backend port.

​
Next Steps

Dependencies

Learn about all project dependencies and their purposes

Troubleshooting

Common issues and how to resolve them

Build docs developers (and LLMs) love

Get started for freeTalk to us