डेवलपर्स के लिए Agent UI

ऐप AI को बनाने दें। जब चाहें, कोड खोलें। हर ऐप अपने MCP सर्वर के साथ आता है, और CLI से आप उसे अपने एडिटर में पुल कर सकते हैं, अपने कोडिंग असिस्टेंट के साथ काम कर सकते हैं और वापस पब्लिश कर सकते हैं।

npm install -g @agentuiai/cli

Node.js 22 या उससे नया वर्ज़न चाहिए।

irm https://cdn.agentui.ai/cli/install.ps1 | iex

PowerShell में चलाएँ। Node.js या एडमिन अधिकारों की ज़रूरत नहीं।

$ agentui auth login
✓ Signed in as you@acme.com
$ agentui project sync <workflow-id>
✓ entities/ pages/ components/ functions/ mcp/
$ claude "add a reorder button to the stock page"
$ agentui validate --all
✓ No problems found
$ agentui project push --build
✓ Build finished · development

इनके साथ काम करता है

Claude Code
Cursor
Codex
VS Code Copilot
ChatGPT
Windsurf

बिल्ट-इन

हर ऐप अपने MCP सर्वर के साथ आता है।

इसे चालू करें, और Claude, ChatGPT, Cursor या कोई भी MCP क्लाइंट किसी व्यक्ति की ओर से आपके ऐप का डेटा देख और बदल सकता है, और उसे सिर्फ़ वही दिखता है, जो उस व्यक्ति को देखने की अनुमति है। न कोई सर्वर होस्ट करना, न कोई कोड लिखना।

हर टेबल के लिए अपने-आप बने डेटा टूल्स: list, get, count, create, update और delete
हर एनवायरनमेंट के लिए एक पता, जो आपके चालू करने तक बंद रहता है
सिर्फ़-देखने वाले या पढ़ने-और-लिखने वाले कनेक्शन, और आप इनमें से किसी को भी रद्द कर सकते हैं
हर कॉल पर Data Security नियम जाँचे जाते हैं
गाइड और कस्टम टूल्स, जो असिस्टेंट्स को आपकी प्रक्रियाएँ सिखाते हैं

MCP कैसे चालू करें

data_orders_list
data_orders_get
data_orders_count
data_orders_create
data_orders_update
data_orders_delete
tool_summarize_overdue_invoices

आपका ऐप बस एक फ़ोल्डर है

ऐप सिंक करें और आपको उसका असली कोड मिलता है: JSON के रूप में डेटा टेबल, पेज, कंपोनेंट, बैकएंड फ़ंक्शन और कस्टम AI टूल्स। AGENTS.md और CLAUDE.md आपके कोडिंग असिस्टेंट को सिखाते हैं कि Agent UI ऐप्स कैसे बनते हैं।

किसी भी एडिटर में एडिट करें
उसी वैलिडेटर से जाँचें, जिसे प्लेटफ़ॉर्म इस्तेमाल करता है
एक कमांड में पब्लिश और रीबिल्ड करें

acme-stock/

entities/ JSON के रूप में डेटा टेबल

pages/

components/

functions/ → /api/<name>

mcp/ कस्टम AI टूल्स

Layout.jsx

AGENTS.md

.claude/CLAUDE.md

एडिट लूप

फ़ाइलें ख़ुद बदलें या अपने असिस्टेंट से बदलवाएँ। जाँचें, तुलना करें और अपने चुने हुए एनवायरनमेंट में पब्लिश करें। हर एनवायरनमेंट का अपना डेटाबेस होता है।

agentui validate --all
agentui project diff
agentui project push --build

$ agentui project diff
  M pages/Stock.jsx
  A functions/reorder.js
$ agentui project push --build
✓ Uploaded 2 files
✓ Build finished · development

MCP से अपना असिस्टेंट जोड़ें

Agent UI का MCP सर्वर Claude, ChatGPT, Cursor या VS Code को ऐप्स और टेबल बनाने, रिकॉर्ड पढ़ने और अपडेट करने, और आपके ऐप की प्रक्रियाएँ चलाने देता है, हमेशा साइन इन करने वाले व्यक्ति की अनुमतियों के साथ। न कुछ इंस्टॉल करना, न कोई API key कॉपी करनी।

Agent UI Apps

सिर्फ़-डेटा वाले ऐप्स बनाएँ, उनकी टेबल्स का ढाँचा तय करें और रिकॉर्ड अप-टू-डेट रखें।

https://api.agentui.ai/mcp/apps

आपका ऐप

हर एनवायरनमेंट के लिए एक पता, जिसे ऐप के AI असिस्टेंट्स पैनल से कॉपी किया जाता है। इसे सिर्फ़ वही दिखता है, जो साइन इन किया हुआ उपयोगकर्ता देख सकता है।

इसे कैसे चालू करें →

$ claude mcp add --transport http agentui-apps https://api.agentui.ai/mcp/apps

{
  "mcpServers": {
    "agentui-apps": { "url": "https://api.agentui.ai/mcp/apps" }
  }
}

Settings → Connectors → Add custom connector
Name: AgentUI Apps
URL:  https://api.agentui.ai/mcp/apps
Connect → sign in with Agent UI

आप क्या-क्या पूछ सकते हैं

Field Visits नाम का एक डेटा ऐप बनाएँ, जिसमें Visits टेबल हो
एक status फ़ील्ड जोड़ें, जिसकी वैल्यू सिर्फ़ planned, done या cancelled हो सके
मेरी पेस्ट की हुई स्प्रेडशीट से ये 40 पंक्तियाँ इम्पोर्ट करें
500 से ऊपर का हर खुला ऑर्डर दिखाएँ
पिछले महीने के खुले ऑर्डर को लेट मार्क करें
इस ग्राहक के बकाया इनवॉइस का सारांश बनाएँ

Field Visits नाम का एक डेटा ऐप बनाएँ, जिसमें Visits टेबल हो
एक status फ़ील्ड जोड़ें, जिसकी वैल्यू सिर्फ़ planned, done या cancelled हो सके
मेरी पेस्ट की हुई स्प्रेडशीट से ये 40 पंक्तियाँ इम्पोर्ट करें
500 से ऊपर का हर खुला ऑर्डर दिखाएँ
पिछले महीने के खुले ऑर्डर को लेट मार्क करें
इस ग्राहक के बकाया इनवॉइस का सारांश बनाएँ

कस्टम MCP टूल्स

असिस्टेंट को अपने ऐप की कोई प्रक्रिया सिखाएँ, जैसे बकाया इनवॉइस का सारांश बनाना या टिकट बंद करके उसके ओनर को सूचना देना। ऐप चैट में इसके लिए कहें और Agent UI उस टूल को आपके ऐप के mcp फ़ोल्डर में एक फ़ाइल के रूप में लिख देता है।

साइन इन किए हुए ऐप उपयोगकर्ता के रूप में चलता है
Data Security नियम तब भी लागू रहते हैं
हर टूल को अलग से चालू या बंद करें
Agent UI आपके लिए फ़ाइल लिखता है

import { defineTool } from "@/mcp";
import { Invoice } from "@/entities/Invoice";

export default defineTool({
  description: "Summarize a customer's overdue invoices",
  input: { /* JSON Schema: customerId */ },
  annotations: { readOnlyHint: true },

  async run({ customerId }) {
    const rows = await Invoice.filter({
      customer_id: customerId,
      status: "overdue",
    });
    return { count: rows.length };
  },
});

बैकएंड फ़ंक्शन, API और ऐप सिग्नल

functions/ की हर फ़ाइल /api/<name> पर उपलब्ध होती है। ऐसे API जोड़ें जिन्हें Agent UI अभी सपोर्ट नहीं करता, keys को secrets में रखें, और console.human से अपने चलते हुए ऐप से सीधे बिल्ड चैट में मैसेज भेजें।

CLI से फ़ंक्शन टेस्ट करें और उनके लॉग पढ़ें
सीक्रेट वैल्यू सर्वर पर ही रहती हैं
डेवलपमेंट, स्टेजिंग और प्रोडक्शन के अलग-अलग एनवायरनमेंट

import { Stock } from "@/entities/Stock";

export default async function (ctx) {
  const item = await Stock.get(ctx.body.id);
  await Stock.update(item.key, { reorder: true });

  return { ok: true };
}

डेवलपर टूल्स

CLI इंस्टॉल करें और अपना पहला ऐप पुल करें।

npm install -g @agentuiai/cliमुफ़्त और MIT लाइसेंस के तहत। Node.js 22 या उससे नया वर्ज़न चाहिए।

CLI डॉक्स पढ़ें मुफ़्त में बनाना शुरू करें

जो बनाना है, उसके हिसाब से देखें

नीचे दिया हर टूल आपके मौजूदा डेटा पर चलता है, रोल-आधारित एक्सेस, पूरे ऑडिट ट्रेल और पीछे खड़े एक असली इंसान के साथ।

सभी यूज़ केस देखें →