mirror of
https://github.com/Wan-Video/Wan2.1.git
synced 2025-11-03 22:04:21 +00:00
This commit adds a production-ready Progressive Web App for AI-powered video generation using Wan2.1 models. Features: - Next.js 15 frontend with App Router and PWA support - FastAPI backend with Replicate integration - 50+ prompt templates across 7 categories - Supabase authentication and database - Credit system with usage tracking - Text-to-Video and Image-to-Video generation - Complete documentation (setup, deployment, contributing) Project Structure: - apps/web: Next.js frontend with shadcn/ui components - apps/api: FastAPI backend with GPU processing via Replicate - packages/db: Database schema and migrations for Supabase Tech Stack: - Frontend: Next.js 15, shadcn/ui, Tailwind, Zustand, React Hook Form, Zod - Backend: FastAPI, Replicate, Supabase - Database: Supabase (Postgres) with RLS - Infrastructure: Turborepo monorepo, Vercel/Modal deployment Documentation: - README.md: Project overview and features - SETUP.md: Complete setup guide (5-minute quickstart) - DEPLOYMENT.md: Production deployment instructions - CONTRIBUTING.md: Contribution guidelines - PROJECT_SUMMARY.md: Comprehensive project documentation Ready for development and deployment. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
187 lines
3.8 KiB
Markdown
187 lines
3.8 KiB
Markdown
# Setup Guide
|
|
|
|
## Quick Start (5 Minutes)
|
|
|
|
### 1. Prerequisites
|
|
|
|
- Node.js 18+ installed
|
|
- Python 3.10+ installed
|
|
- Supabase account (free tier)
|
|
- Replicate account ($10 free credit)
|
|
|
|
### 2. Clone and Install
|
|
|
|
```bash
|
|
git clone <your-repo-url>
|
|
cd wan-pwa
|
|
npm install
|
|
```
|
|
|
|
### 3. Get Credentials
|
|
|
|
#### Supabase Setup (3 minutes)
|
|
|
|
1. Go to https://supabase.com
|
|
2. Create new project: "wan-pwa"
|
|
3. Wait ~2 minutes for provisioning
|
|
4. Go to Settings → API
|
|
5. Copy these 4 values:
|
|
- Project URL → `NEXT_PUBLIC_SUPABASE_URL`
|
|
- anon public → `NEXT_PUBLIC_SUPABASE_ANON_KEY`
|
|
- service_role → `SUPABASE_SERVICE_ROLE_KEY`
|
|
- JWT Secret → `SUPABASE_JWT_SECRET`
|
|
|
|
#### Replicate Setup (2 minutes)
|
|
|
|
1. Go to https://replicate.com
|
|
2. Sign up with GitHub
|
|
3. Go to https://replicate.com/account/api-tokens
|
|
4. Create token → Copy → `REPLICATE_API_TOKEN`
|
|
|
|
### 4. Configure Environment
|
|
|
|
#### Frontend (.env.local)
|
|
|
|
```bash
|
|
cd apps/web
|
|
cp .env.example .env.local
|
|
```
|
|
|
|
Edit `.env.local`:
|
|
```bash
|
|
NEXT_PUBLIC_SUPABASE_URL=https://xxxxx.supabase.co
|
|
NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGci...
|
|
SUPABASE_SERVICE_ROLE_KEY=eyJhbGci...
|
|
NEXT_PUBLIC_API_URL=http://localhost:8000
|
|
NEXT_PUBLIC_APP_URL=http://localhost:3000
|
|
```
|
|
|
|
#### Backend (.env)
|
|
|
|
```bash
|
|
cd ../api
|
|
cp .env.example .env
|
|
```
|
|
|
|
Edit `.env`:
|
|
```bash
|
|
SUPABASE_URL=https://xxxxx.supabase.co
|
|
SUPABASE_SERVICE_ROLE_KEY=eyJhbGci...
|
|
REPLICATE_API_TOKEN=r8_xxxxx
|
|
ALLOWED_ORIGINS=http://localhost:3000
|
|
```
|
|
|
|
### 5. Database Setup
|
|
|
|
```bash
|
|
# From project root
|
|
cd packages/db
|
|
|
|
# Run migration in Supabase dashboard:
|
|
# 1. Go to SQL Editor in Supabase
|
|
# 2. Create new query
|
|
# 3. Copy contents of migrations/001_initial_schema.sql
|
|
# 4. Run query
|
|
```
|
|
|
|
### 6. Start Development
|
|
|
|
```bash
|
|
# Terminal 1: Frontend
|
|
cd apps/web
|
|
npm run dev
|
|
# → http://localhost:3000
|
|
|
|
# Terminal 2: Backend
|
|
cd apps/api
|
|
pip install -r requirements.txt
|
|
uvicorn main:app --reload
|
|
# → http://localhost:8000
|
|
```
|
|
|
|
### 7. Test the App
|
|
|
|
1. Open http://localhost:3000
|
|
2. Click "Get Started"
|
|
3. Sign up with email
|
|
4. Browse prompt templates
|
|
5. Generate your first video!
|
|
|
|
---
|
|
|
|
## Troubleshooting
|
|
|
|
### "Module not found" errors
|
|
|
|
```bash
|
|
# Clear caches and reinstall
|
|
rm -rf node_modules package-lock.json
|
|
npm install
|
|
```
|
|
|
|
### Supabase connection errors
|
|
|
|
Check:
|
|
- URLs don't have trailing slashes
|
|
- Keys are complete (very long strings)
|
|
- Project is fully provisioned (not still "Setting up")
|
|
|
|
### API not starting
|
|
|
|
```bash
|
|
# Check Python version
|
|
python --version # Should be 3.10+
|
|
|
|
# Try with full path
|
|
python3 -m uvicorn main:app --reload
|
|
```
|
|
|
|
### Database migration fails
|
|
|
|
- Make sure you're using the SQL Editor in Supabase dashboard
|
|
- Check that UUID extension is enabled
|
|
- Verify you're in the correct project
|
|
|
|
---
|
|
|
|
## Next Steps
|
|
|
|
- [ ] Customize prompt templates in `apps/web/src/lib/prompts/templates.ts`
|
|
- [ ] Add your logo in `apps/web/public/icons/`
|
|
- [ ] Setup GitHub Actions for CI/CD
|
|
- [ ] Deploy to production (see DEPLOYMENT.md)
|
|
|
|
---
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
wan-pwa/
|
|
├── apps/
|
|
│ ├── web/ # Next.js frontend
|
|
│ │ ├── src/
|
|
│ │ │ ├── app/ # Pages & layouts
|
|
│ │ │ ├── components/ # React components
|
|
│ │ │ └── lib/ # Utilities & hooks
|
|
│ │ └── public/ # Static assets
|
|
│ │
|
|
│ └── api/ # FastAPI backend
|
|
│ ├── routes/ # API endpoints
|
|
│ ├── core/ # Business logic
|
|
│ └── models/ # Pydantic models
|
|
│
|
|
├── packages/
|
|
│ └── db/ # Database schema
|
|
│ └── migrations/ # SQL migrations
|
|
│
|
|
└── turbo.json # Monorepo config
|
|
```
|
|
|
|
---
|
|
|
|
## Need Help?
|
|
|
|
- Check [README.md](./README.md) for features overview
|
|
- See [DEPLOYMENT.md](./DEPLOYMENT.md) for production setup
|
|
- Open an issue on GitHub
|