Quick Start

Local Development

Prerequisites

  • Node.js 18+
  • pnpm package manager
  • Git

Installation

git clone https://github.com/your-username/qwen-image-edit.git my-qwen-project
cd my-qwen-project
pnpm install

Environment Setup

Copy the environment variables file and configure your settings:

cp .env.example .env.local

Edit .env.local with your configuration:

# Database
DATABASE_URL="your-database-url"

# Authentication
NEXTAUTH_SECRET="your-nextauth-secret"
NEXTAUTH_URL="http://localhost:3000"

# AI Model Configuration
QWEN_API_KEY="your-qwen-api-key"
QWEN_API_ENDPOINT="your-qwen-endpoint"

# Storage (optional)
UPLOADTHING_SECRET="your-uploadthing-secret"
UPLOADTHING_APP_ID="your-uploadthing-app-id"

Start Development Server

pnpm dev

Open http://localhost:3000 in your browser to see the application.

Basic Usage

Image Upload

  1. Navigate to the editor page
  2. Click "Upload Image" or drag and drop an image
  3. Supported formats: JPG, PNG, WebP (max 10MB)

Text Editing

To edit text in images:

// Example API call for text editing
const response = await fetch('/api/image-edit', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    image: imageBase64,
    prompt: 'Change the text "Hello" to "你好"',
    editType: 'text'
  })
});

Semantic Editing

For semantic changes:

// Example API call for semantic editing
const response = await fetch('/api/image-edit', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    image: imageBase64,
    prompt: 'Change the cat to a dog while keeping the same pose',
    editType: 'semantic'
  })
});

Next Steps