A local developer tool for testing deAPI.ai endpoints — unified AI inference API for image generation, video creation, audio synthesis, and more.
What is deAPI? A single API to access multiple AI models (Stable Diffusion, Flux, Kling, Minimax, etc.) for image generation, video creation, text-to-speech, transcription and more. Learn more at deapi.ai.
- Endpoint Browser - Browse and select from all available deAPI endpoints organized by category
- Dynamic Forms - Automatically generated forms based on endpoint parameters with model-aware limits and defaults
- Dynamic Models - Model options, limits, defaults, voices, and languages auto-discovered from API (zero code changes to add models)
- Async Job Tracking - Real-time polling with SSE for async operations (image/video generation)
- Request Inspector - View raw request/response JSON for debugging
- Job History - Persistent history of all requests with status, cost, and results
- Result Preview - Inline previews for images, videos, and audio
- Download Manager - Save generated results to local directory
- Output Picker - Reuse previously downloaded images as input (e.g. use txt2img result in img2img)
- Random Prompts - Dice button fills in creative prompts for quick testing
- Balance Display - Track your deAPI credit balance
- Multi-Profile Config - Multiple API profiles for different environments (production, staging, etc.)
- Light/Dark Theme - Toggle between light and dark mode with system preference support
- Price Calculator - Pre-calculate costs before sending requests
- Framework: Next.js 15 (App Router)
- Language: TypeScript (strict mode)
- Styling: Tailwind CSS
- Storage: Local JSON files (no database required)
- Node.js 18+
- npm
- deAPI account and API token from deapi.ai
# Clone the repository
git clone https://github.com/deapi-ai/deapi-tester.git
cd deapi-testerdocker compose up -dOpen http://localhost:1337 — enter your API token in the settings drawer that opens automatically.
npm install
# Start development server
npm run devOpen http://localhost:3000 in your browser.
Option 1: UI Configuration (Recommended for local use)
- Click the gear icon in the top right corner
- Enter your deAPI token and other settings
- Create multiple profiles for different environments
- Configuration is saved to
data/config.json
Option 2: Environment Variables
Copy .env.local.example to .env.local:
cp .env.local.example .env.localEdit .env.local:
DEAPI_API_TOKEN=your_token_here
DEAPI_API_URL=https://api.deapi.ai/api/v1/client
DEAPI_OUTPUT_DIR=./output
DEAPI_POLLING_INTERVAL_MS=2000
DEAPI_MAX_POLLING_ATTEMPTS=120Priority: Environment variables override data/config.json values when both exist.
Git-ignored files:
.env.local- excluded from git (safe to store tokens)data/config.json- excluded from git (local configuration)data/history.json- excluded from git (your job history)output/- excluded from git (generated files)
- Select an endpoint from the left sidebar (grouped by category: Image, Video, Audio, etc.)
- Fill in the form with required parameters (prompt, model, dimensions, etc.)
- Click Execute to send the request
- Track progress in the Jobs panel below:
- View polling status for async operations
- Click "Raw" to see the full request/response JSON
- Preview results inline
- Download completed results
deapi-tester/
├── src/
│ ├── app/
│ │ ├── page.tsx # Main UI layout
│ │ ├── layout.tsx # Root layout (theme script)
│ │ ├── globals.css # Global styles, CSS variables, theme definitions
│ │ ├── api/
│ │ │ ├── proxy/ # Proxy requests to deAPI
│ │ │ ├── poll/[id]/ # SSE polling for async jobs
│ │ │ ├── endpoints/ # GET endpoint registry
│ │ │ ├── history/ # Job history CRUD
│ │ │ ├── config/ # Configuration management
│ │ │ ├── models/ # Proxy to deAPI /models
│ │ │ ├── balance/ # Proxy to deAPI /balance
│ │ │ ├── files/ # List/serve files from output dir
│ │ │ └── download/ # Download results
│ ├── components/
│ │ ├── Providers.tsx # Root providers (Contexts + Toast)
│ │ ├── BalanceContext.tsx # Balance state (useBalance hook)
│ │ ├── ModelsContext.tsx # Models cache (useModelsContext hook)
│ │ ├── ThemeContext.tsx # Theme state (useTheme hook)
│ │ ├── Toast.tsx # Toast notifications (useToast hook)
│ │ ├── ConfigPanel.tsx # Quick profile switcher (header)
│ │ ├── ConfigDrawer.tsx # Full settings drawer
│ │ ├── EndpointSelector.tsx # Endpoint browser
│ │ ├── EndpointForm.tsx # Dynamic form generator
│ │ ├── RequestInspector.tsx # Raw JSON viewer
│ │ ├── JobTracker.tsx # Polling status, progress bar
│ │ ├── JobsPanel.tsx # Job tracking & history
│ │ ├── ResultViewer.tsx # Preview img/video/audio
│ │ ├── HistoryPanel.tsx # Previous jobs list
│ │ ├── ModelInfo.tsx # Model metadata display
│ │ ├── PriceCalculator.tsx # Cost pre-calculator
│ │ ├── form/ # Form field components
│ │ │ ├── FormField.tsx # Generic form field renderer
│ │ │ ├── FileUploadField.tsx # File upload with preview
│ │ │ └── OutputPicker.tsx # Pick images from output directory
│ │ └── jobs/ # Job-related components
│ │ ├── JobRow.tsx # Single job row
│ │ └── JobLogsView.tsx # Logs view
│ ├── hooks/
│ │ ├── useDeApi.ts # Main API hook
│ │ ├── usePolling.ts # SSE/polling hook
│ │ └── useConfig.ts # Configuration hook
│ └── lib/
│ ├── endpoint-registry.ts # Endpoint definitions (form structure only)
│ ├── deapi-client.ts # HTTP client for deAPI
│ ├── config.ts # Configuration management
│ ├── storage.ts # JSON file operations
│ ├── types.ts # TypeScript types
│ ├── constants.ts # Shared constants
│ ├── format-utils.ts # Formatting utilities
│ ├── form-utils.ts # Form utilities
│ └── sample-prompts.ts # Random prompt data
├── data/ # Local storage (auto-created, git-ignored)
├── output/ # Downloaded results (git-ignored)
└── ...
Endpoints are defined in src/lib/endpoint-registry.ts. To add a new endpoint:
{
id: 'my-new-endpoint',
name: 'My New Endpoint',
group: 'image-generation',
method: 'POST',
path: '/my-endpoint',
description: 'Does something cool',
contentType: 'json',
isAsync: true,
hasPriceCalc: true,
priceCalcPath: '/my-endpoint/price-calculation',
params: [
{ name: 'prompt', label: 'Prompt', type: 'textarea', required: true },
{ name: 'model', label: 'Model', type: 'select', required: true },
// NO hardcoded options/limits — they come from /models API
]
}The form is automatically generated. Model options, limits, and defaults are loaded dynamically from the API.
- All requests to deAPI go through the backend proxy (
/api/proxy) which adds the Authorization header and logs to history - Async job polling uses Server-Sent Events (SSE) from
/api/poll/[id] - Endpoint registry defines form structure only (field names, types, required flags)
- All model data (slugs, limits, defaults, voices, languages) comes dynamically from
/api/models - Adding a new model to deAPI requires zero code changes — it auto-appears in the UI
- Configuration and history are stored in local JSON files
Contributions are welcome! Please read the Contributing Guide before submitting a PR.
- Fork the repository
- Create your branch:
git checkout -b feature/my-feature - Commit your changes
- Push and open a Pull Request
- deAPI.ai — Unified AI inference API
- API Documentation — Full endpoint reference, auth, webhooks, WebSockets
- Claude Code Skills — Use deAPI directly from Claude Code terminal (generate images, videos, audio, transcribe and more)
- Report a Bug