Spaces:
Runtime error
Runtime error
A newer version of the Gradio SDK is available:
6.3.0
π Complete Deployment Guide to Hugging Face
Before You Start
Prerequisites
- A Hugging Face account (Sign up here)
- A Google API key with Gemini API access (Get one here)
- At least 5-10 video clips (MP4 format recommended)
Part 1: Create Your Hugging Face Space
Step 1: Create New Space
- Go to https://huggingface.co/spaces
- Click the "Create new Space" button (top right)
- Fill in the details:
- Owner: Your username
- Space name: Choose a name (e.g.,
ai-video-generator) - License: Apache 2.0 (recommended)
- Select the Space SDK: Choose Gradio
- Space hardware: Start with CPU basic (free) - you can upgrade later
- Space visibility: Public or Private (your choice)
- Click "Create Space"
Part 2: Upload Your Code Files
Step 2: Upload Main Files via Web Interface
- You should now be in your Space's main page
- Click on "Files and versions" tab
- Click "Add file" β "Upload files"
- Upload these files (download from the artifacts above):
app.pyrequirements.txtpackages.txtREADME.md.gitignore.gitattributes
- In the commit message box, type:
Initial commit - upload main files - Click "Commit changes to main"
Alternative: Using Git (Advanced)
If you're comfortable with Git:
# Clone your space
git clone https://huggingface.co/spaces/YOUR_USERNAME/YOUR_SPACE_NAME
cd YOUR_SPACE_NAME
# Copy your files
cp /path/to/downloaded/app.py .
cp /path/to/downloaded/requirements.txt .
cp /path/to/downloaded/packages.txt .
cp /path/to/downloaded/README.md .
cp /path/to/downloaded/.gitignore .
cp /path/to/downloaded/.gitattributes .
# Commit and push
git add .
git commit -m "Initial commit - upload main files"
git push
Part 3: Configure API Key
Step 3: Add Google API Key
π¨ CRITICAL: Never put your API key directly in the code!
- In your Space, click "Settings" (gear icon in top right)
- Scroll down to "Repository secrets"
- Click "New secret"
- Enter:
- Name:
GOOGLE_API_KEY - Value: Paste your actual Google API key
- Name:
- Click "Add"
Part 4: Upload Video Clips
Step 4: Create video_clips Folder and Upload Videos
Option A: Using Web Interface
- Go back to "Files and versions" tab
- Click "Add file" β "Upload files"
- Create folder structure by typing:
video_clips/ - Upload your video files (.mp4, .avi, .mkv, or .mov)
- If videos are larger than 10MB, you'll need to use Git LFS (see below)
- Commit with message:
Add video clips
Option B: Using Git with LFS for Large Files
# Make sure you're in your cloned space directory
cd YOUR_SPACE_NAME
# Install Git LFS if not already installed
git lfs install
# Create video_clips folder
mkdir video_clips
# Copy your video files
cp /path/to/your/videos/*.mp4 video_clips/
# Add and commit
git add video_clips/
git commit -m "Add video clips"
git push
Video Requirements:
- At least 5-10 video clips
- Formats: .mp4, .avi, .mkv, or .mov
- Resolution: 720p or 1080p recommended
- Duration: 5-30 seconds per clip works best
Part 5: Optional - Add Background Music
Step 5: Upload Background Music (Optional)
- Go to "Files and versions"
- Click "Add file" β "Upload files"
- Create folder:
background_music/ - Upload your music file (.mp3 or .wav)
- Commit with message:
Add background music
Part 6: Wait for Build and Test
Step 6: Monitor Build Process
- Go back to your Space's main page (click the Space name at top)
- Click on "Logs" tab
- Watch the build process:
- Installing system packages (imagemagick, ffmpeg)
- Installing Python packages
- Starting the app
Build Status Indicators:
- π‘ Yellow "Building": In progress
- π’ Green "Running": Successfully built!
- π΄ Red "Failed": Check logs for errors
Step 7: Test Your App
Once the status shows "Running":
- Go to the "App" tab
- You should see your video generator interface!
- Test it:
- Enter some text (e.g., "Hello world, this is a test video")
- Select a voice
- Click "Generate Video"
- Wait for the video to generate
Part 7: Troubleshooting Common Issues
Issue 1: "Video clips folder not found"
Solution: Upload videos to the video_clips folder (Step 4)
Issue 2: "TTS failed: Error"
Solution:
- Check that API key is correctly set in Settings β Repository secrets
- Verify the key name is exactly
GOOGLE_API_KEY - Test your API key at https://aistudio.google.com/
Issue 3: Build Fails
Solution:
- Check the Logs tab for specific error messages
- Common fixes:
- Ensure
requirements.txtis properly uploaded - Ensure
packages.txtis properly uploaded - Try restarting the Space (Settings β Factory reboot)
- Ensure
Issue 4: Out of Memory
Solution:
- Upgrade to better hardware (Settings β Change hardware)
- Or use fewer/smaller video clips
Issue 5: Videos Upload Fails
Solution:
- Use Git LFS for files over 10MB
- Or use smaller video files
- Or compress videos before uploading
Part 8: Optimize and Share
Step 8: Upgrade Hardware (Optional)
For better performance:
- Go to Settings
- Scroll to "Hardware"
- Choose a better option:
- CPU Upgrade ($0.60/hour)
- T4 GPU ($0.60/hour) - Recommended for faster processing
- A10G GPU ($3/hour) - For very fast processing
- Click "Update"
Step 9: Share Your Space
Your Space is now live! Share it:
- Direct URL:
https://huggingface.co/spaces/YOUR_USERNAME/YOUR_SPACE_NAME - Click "Share" button to get embed codes
- Add to your portfolio or website
Quick Checklist
Use this to ensure everything is set up:
- β Created Hugging Face Space
- β
Uploaded
app.py - β
Uploaded
requirements.txt - β
Uploaded
packages.txt - β
Uploaded
README.md - β
Added
GOOGLE_API_KEYto Repository secrets - β
Uploaded video clips to
video_clips/folder - β (Optional) Uploaded background music
- β Space shows "Running" status
- β Tested video generation successfully
Need Help?
- Check Logs: Always check the Logs tab for error messages
- Community: Ask in Hugging Face Discord
- Documentation: Gradio Spaces Docs
Summary of File Locations
After setup, your Space structure should look like:
your-space-name/
βββ app.py β
Main application file
βββ requirements.txt β
Python dependencies
βββ packages.txt β
System dependencies
βββ README.md β
Documentation
βββ .gitignore β
Git ignore rules
βββ .gitattributes β
LFS configuration
βββ video_clips/ β
Your video files (REQUIRED!)
β βββ clip1.mp4
β βββ clip2.mp4
β βββ clip3.mp4
βββ background_music/ β Optional music files
β βββ bgmusic.mp3
βββ voice_over/ βοΈ Auto-created by app
βββ exports/ βοΈ Auto-created by app
Legend:
- β = Required, you upload this
- β = Optional
- βοΈ = Auto-created by the app
π Congratulations!
You've successfully deployed your AI Video Generator to Hugging Face Spaces!
Now you can create amazing videos with AI voiceovers and animated subtitles right from your browser.