A comprehensive web application that enables users to create professional-quality videos using AI-powered tools and simple text prompts. Built with the MERN stack and featuring a cinematic black theme with 3D design elements.
- AI-Powered Video Generation: Create videos from simple text prompts using advanced AI
- Multiple API Integrations: Support for Shotstack, Creatomate, Plainly Videos, and Tavus APIs
- Open Source Tools: Integration with PromptClip, Lucy Edit, LTXVideo, and Wan 2.1
- Real-time Preview: See changes instantly with live editing capabilities
- 3D Effects & Animations: Stunning 3D design elements and cinematic effects
- Multiple Export Formats: Support for various video formats up to 4K resolution
- Cinematic Black Theme: Modern, professional design with dark aesthetics
- Responsive Design: Works seamlessly across all devices
- Intuitive Dashboard: Easy-to-use interface for managing projects
- Real-time Collaboration: Share projects and work with team members
- Homepage: 8 comprehensive sections showcasing features and capabilities
- About Us: 8 detailed sections about the company and mission
- Features: 8 sections highlighting platform capabilities
- Contact: Complete contact information and support options
- Authentication: Secure login and signup with social options
- Dashboard: Full-featured project management and video creation interface
- React 18: Modern React with hooks and functional components
- React Router: Client-side routing
- Styled Components: CSS-in-JS styling
- Framer Motion: Smooth animations and transitions
- Three.js: 3D graphics and effects
- React Three Fiber: React integration for Three.js
- Axios: HTTP client for API requests
- React Hook Form: Form handling and validation
- React Hot Toast: Notifications and alerts
- Node.js: Runtime environment
- Express.js: Web framework
- MongoDB: Database
- Mongoose: ODM for MongoDB
- JWT: Authentication
- Bcryptjs: Password hashing
- Multer: File upload handling
- Helmet: Security middleware
- CORS: Cross-origin resource sharing
- Shotstack API: Video generation and editing
- Creatomate API: Template-based video creation
- Plainly Videos API: Automated video production
- Tavus API: Personalized video generation
- PromptClip: Open-source video generation tool
- Lucy Edit: AI-powered video editing by Daycart
- LTXVideo: Advanced video processing by Lightricks
- Wan 2.1: Video generation tool by Alibaba
- Node.js (v16 or higher)
- MongoDB (local or cloud)
- Git
-
Clone the repository
git clone <repository-url> cd ai-video-editor
-
Install server dependencies
npm install
-
Install client dependencies
cd client npm install cd ..
-
Environment Configuration Create a
.envfile in the root directory:NODE_ENV=development PORT=5000 MONGODB_URI=mongodb://localhost:27017/ai-video-editor JWT_SECRET=your-super-secret-jwt-key-change-this-in-production CLIENT_URL=http://localhost:3000 # API Keys (Add your actual API keys here) SHOTSTACK_API_KEY=4bEY6gvxmoeZjQkriUdsc1mdz9lLXW7a9n5xqNyQ CREATOMATE_API_KEY=0c924f2a645a4c5a92beff2e4b228feb783d24983315182b1c6bf1a618ff9f5699dcbdd7b0aa4e08d3965390821122ec PLAINLY_API_KEY=fV34uiorV7nIQDCwoNtqEdbVx8AwVfsN TAVUS_API_KEY=e39b1deee39e472589365b02f01002f3
-
Start MongoDB Make sure MongoDB is running on your system.
-
Run the application
# Development mode (runs both server and client) npm run dev # Or run separately: # Server only npm run server # Client only npm run client
-
Access the application
- Frontend: http://localhost:3000
- Backend API: http://localhost:5000
To use the full functionality of the platform, you'll need to obtain API keys from the following services:
- Visit: https://shotstack.io/
- Sign up for a free account
- Get your API key from the dashboard
- Add to
.envfile asSHOTSTACK_API_KEY
- Visit: https://creatomate.com/
- Create an account
- Generate an API key
- Add to
.envfile asCREATOMATE_API_KEY
- Visit: https://plainlyvideos.com/
- Sign up for an account
- Get your API key
- Add to
.envfile asPLAINLY_API_KEY
- Visit: https://tavus.io/
- Create an account
- Generate an API key
- Add to
.envfile asTAVUS_API_KEY
The following tools are integrated and don't require API keys:
- PromptClip: Open source GitHub repository
- Lucy Edit: By Daycart
- LTXVideo: By Lightricks
- Wan 2.1: By Alibaba
The application uses a cinematic black theme with customizable colors. You can modify the color scheme by updating the CSS variables in the main stylesheet.
To integrate additional video generation APIs:
- Add the API configuration to
server/services/videoProcessing.js - Create a new processing function following the existing pattern
- Add the API option to the dashboard interface
- Update the frontend to handle the new API
The application uses a combination of:
- Global CSS for base styles
- Component-specific CSS modules
- Styled Components for dynamic styling
- CSS custom properties for theming
- Sign Up: Create a new account or sign in
- Configure API Keys: Add your API keys in the settings
- Create Project: Click "Create New" in the dashboard
- Write Prompt: Describe your video idea in natural language
- Select API: Choose which service to use for generation
- Generate: Click create and wait for processing
- Download: Once complete, download your video
- Project Management: View, edit, and delete your video projects
- Template Library: Choose from professional video templates
- Analytics: Track your video performance and usage statistics
- Settings: Manage API keys, account settings, and preferences
- JWT Authentication: Secure token-based authentication
- Password Hashing: Bcrypt for secure password storage
- CORS Protection: Configured for secure cross-origin requests
- Helmet Security: Additional security headers
- Rate Limiting: Protection against abuse
- Input Validation: Server-side validation for all inputs
-
Build the client
cd client npm run build cd ..
-
Set production environment variables
NODE_ENV=production MONGODB_URI=your-production-mongodb-uri JWT_SECRET=your-production-jwt-secret CLIENT_URL=your-production-frontend-url
-
Deploy to your preferred platform
- Heroku
- Vercel
- AWS
- DigitalOcean
- Or any Node.js hosting service
A Dockerfile can be created for containerized deployment:
FROM node:16-alpine
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN cd client && npm install && npm run build
EXPOSE 5000
CMD ["npm", "start"]- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add some amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
For support and questions:
- Email: support@aivideoeditor.com
- Documentation: [Link to documentation]
- Issues: GitHub Issues
- Shotstack for video generation API
- Creatomate for template-based video creation
- Plainly Videos for automated video production
- Tavus for personalized video generation
- Open source contributors for PromptClip, Lucy Edit, LTXVideo, and Wan 2.1
- React and Node.js communities for excellent frameworks
- Real-time collaboration features
- Advanced 3D model integration
- Voice-to-video generation
- Mobile app development
- Advanced analytics dashboard
- Custom template creation
- Team management features
- API rate limiting and usage tracking
Built with ❤️ by the AI Video Editor Team