AI-Short-Video-Ads-Generator

KO | EN

gitlite — search

#typescript #ai-agents #ai #dsh-plugin #deepseek-harness #open-source #claude-code #codex #cli #developer-tools #react #windows

AI-Short-Video-Ads-Generator

★ 1 Open GitHub ↗

AI-powered platform to generate high-quality short video advertisements using product and model images with customizable outputs.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# AI Short Video Ads Generator

**AI Short Video Ads Generator** is a cutting-edge platform that leverages artificial intelligence to create high-quality, professional short video advertisements. Users can generate stunning product showcases and lifestyle videos with ease, simply by uploading images and providing a brief description.

## Features

- **AI-Powered Generation**: Utilizes advanced AI models to generate realistic and creative video content.
- **Dual Image Input**: Supports both **Product Images** and **Model Images** to create personalized advertisements.
- **Customizable Outputs**: Configure aspect ratio (Vertical/Horizontal) and add custom prompts for tailored results.
- **User Authentication**: Secure login and signup system powered by **Clerk**.
- **Subscription Plans**: Multiple tiers (Free, Pro, Premium) to cater to different user needs.
- **Project Management**: Track and manage your video generation projects.
- **Community Showcase**: Share your best creations with the community.

## Tech Stack

### Frontend
- **React**: UI Library
- **TypeScript**: Type Safety
- **Tailwind CSS**: Styling
- **Lucide React**: Icon Library
- **Axios**: HTTP Client
- **Clerk React**: Authentication
- **React Router**: Navigation
- **React Hot Toast**: Notifications

### Backend
- **Node.js**: Runtime Environment
- **Express**: Web Framework
- **TypeScript**: Type Safety
- **Google GenAI**: AI Model Integration
- **Multer**: File Upload Handling
- **Clerk Node**: Authentication
- **Dotenv**: Environment Variables

## Folder Structure

```text
AI-Short-Video-Ads-Generator/
├── client/                      # React Frontend Application (Vite + TS)
│   ├── public/                  # Static assets and icons
│   └── src/
│       ├── assets/              # Images, videos, and illustration assets
│       ├── components/          # Reusable components (Navbar, Hero, Lenis, CTA, Faq, etc.)
│       ├── configs/             # Axios API base configuration
│       ├── pages/               # App views (Home, Plans, Generator, MyGenerations, Result, Community)
│       ├── types/               # TypeScript interface definitions
│       ├── App.tsx              # Main routing & application layout
│       ├── index.css            # Tailwind & global stylesheet
│       └── main.tsx             # SPA React client entry point
├── server/                      # Express Backend Server (Node.js + TS)
│   ├── configs/                 # Sentry, Prisma, and Multer configurations
│   ├── controllers/             # Request handlers (user profile, Clerk webhooks, AI Gen engines)
│   ├── middlewares/             # Security, auth gating, and request validation middlewares
│   ├── prisma/                  # Prisma Database schema (schema.prisma)
│   ├── routes/                  # REST endpoints mapping (userRoutes, projectRoutes)
│   ├── types/                   # Express & request extension typings
│   ├── utils/                   # Shared utility modules (e.g., API Pool managers)
│   └── server.ts                # App entry point & server runner
├── FLOW_DIAGRAM.md              # System flow charts and details
├── index.js                     # Fallback production server entry script
├── package.json                 # Global packages & configurations
└── README.md                    # Core documentation & developer manual
```

## Getting Started

### Prerequisites
- Node.js (v18 or higher)
- npm or yarn
- Google Cloud API Key
- Clerk Publishable Key

### Installation

1.  **Clone the repository**
    ```bash
    git clone https://github.com/anuragverma4895/AI-Short-Video-Ads-Generator.git
    cd AI-Short-Video-Ads-Generator
    ```

2.  **Backend Setup**
    ```bash
    cd server
    npm install
    ```
    Create a `.env` file in the `server` directory with the following variables:
    ```env
    PORT=5000
    GOOGLE_CLOUD_API_KEY=[GCP_API_KEY]
    CLERK_SECRET_KEY=your_clerk_secret_key
    CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key
    ```

3.  **Frontend Setup**
    ```bash
    cd ../client
    npm install
    ```
    Create a `.env` file in the `client` directory with the following variables:
    ```env
    VITE_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key
    VITE_BASEURL=http://localhost:5000
    ```

### Running the Application

1.  **Start the backend**
    ```bash
    cd server
    npm run dev
    ```

2.  **Start the frontend**
    ```bash
    cd ../client
    npm run dev
    ```

3.  **Access the app**
    Open [http://localhost:5173](http://localhost:5173) in your browser.

## Usage

1.  **Sign up or Log in** using the Clerk authentication system.
2.  Navigate to the **Generate** page.
3.  Upload a **Product Image** and a **Model Image**.
4.  Select the desired **Aspect Ratio**.
5.  (Optional) Add a **User Prompt** to customize the output.
6.  Click **Generate** and wait for the AI to process your request.
7.  View your results on the **Result** page and share them on the **Community** page.

## License

This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.

AI-Short-Video-Ads-Generator

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README