A visual workflow builder for designing and running AI-powered DAG pipelines with Google Gemini. Built with Next.js 16, React Flow, Trigger.dev, and PostgreSQL.
Next.js 16 (App Router) | TypeScript | PostgreSQL (Neon) + Prisma 7 | Clerk v7 | React Flow | Trigger.dev | Google Generative AI | Transloadit | Zustand 5 | Tailwind CSS v4 | shadcn/ui | Biome 2.2
- User builds a workflow on a React Flow canvas (nodes + edges)
- Saves to PostgreSQL via
PUT /api/workflows/[id] - Executes via Trigger.dev — topological sort, parallel batch execution
- Client polls for real-time status updates (2s interval)
Node types: Request Inputs (source) → Crop Image / Gemini (processing) → Response (sink)
Prerequisites: Node.js 20+ (or bun), PostgreSQL
DATABASE_URL="postgresql://..."
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY="pk_test_..."
CLERK_SECRET_KEY="sk_test_..."
CLERK_WEBHOOK_SECRET="whsec_..."
TRIGGER_PROJECT_ID="proj_..."
TRIGGER_SECRET_KEY="tr_dev_..."
GOOGLE_AI_API_KEY="AIza..."
TRANSLOADIT_KEY="..."
TRANSLOADIT_SECRET="..."
TRANSLOADIT_WORKSPACE="..."
NEXT_PUBLIC_URL="http://localhost:3000"bun install
bun run db:generate
bun run db:migrate
bun run devOr use the quick-start script to install, generate, and start both the dev server and Trigger.dev in one command:
./script/setup.sh| Command | Description |
|---|---|
npm run dev |
Start dev server |
npm run build |
Production build |
npm run lint |
Biome check |
npm run format |
Auto-format |
npm run db:generate |
Regenerate Prisma client |
npm run db:migrate |
Create Prisma migration |
npm run db:studio |
Open Prisma Studio |
- Clerk authentication with webhook-based user sync
- Dashboard with workflow CRUD, rename, export/import
- React Flow canvas with drag-and-drop node picker, MiniMap, undo/redo
- 4 node types with type-safe connections and cycle prevention
- Parallel DAG execution via Trigger.dev with real-time polling
- Gemini integration with vision support
- Image upload via Transloadit (base64 fallback)
- Run history panel with node-level details
- Auto-save + manual save
- Selective execution (single node, multi-select, or full workflow)