Το Agent UI για προγραμματιστές

Αφήστε το AI να φτιάξει την εφαρμογή. Ανοίξτε τον κώδικα όποτε θέλετε. Κάθε εφαρμογή έρχεται με τον δικό της MCP server και με το CLI την κατεβάζετε στον editor σας, δουλεύετε με τον βοηθό προγραμματισμού σας και τη δημοσιεύετε ξανά.

npm install -g @agentuiai/cli

Απαιτεί Node.js 22 ή νεότερο.

$ 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 server.

Ενεργοποιήστε τον και το Claude, το ChatGPT, το Cursor ή οποιοσδήποτε MCP client μπορεί να αναζητά και να αλλάζει τα δεδομένα της εφαρμογής σας για λογαριασμό ενός χρήστη, βλέποντας μόνο όσα επιτρέπεται να βλέπει εκείνος. Χωρίς server για φιλοξενία, χωρίς κώδικα για γράψιμο.

  • Εργαλεία δεδομένων για κάθε πίνακα: 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, σελίδες, components, backend functions και προσαρμοσμένα εργαλεία AI. Τα AGENTS.md και CLAUDE.md μαθαίνουν στον βοηθό προγραμματισμού σας πώς φτιάχνονται οι εφαρμογές Agent UI.

  • Επεξεργασία σε οποιονδήποτε editor
  • Έλεγχος με τον ίδιο validator που χρησιμοποιεί η πλατφόρμα
  • Δημοσίευση και rebuild με μία εντολή
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

Ο MCP server του Agent UI επιτρέπει στο 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

Τι μπορείτε να ζητήσετε

  • Δημιούργησε μια εφαρμογή δεδομένων με όνομα Επισκέψεις Πεδίου και έναν πίνακα Επισκέψεις
  • Πρόσθεσε ένα πεδίο κατάστασης που δέχεται μόνο προγραμματισμένη, ολοκληρωμένη ή ακυρωμένη
  • Εισήγαγε αυτές τις 40 γραμμές από το υπολογιστικό φύλλο που επικόλλησα
  • Δείξε μου κάθε ανοιχτή παραγγελία πάνω από 500
  • Σημείωσε τις ανοιχτές παραγγελίες του προηγούμενου μήνα ως καθυστερημένες
  • Κάνε μια περίληψη των ληξιπρόθεσμων τιμολογίων αυτού του πελάτη

Προσαρμοσμένα εργαλεία MCP

Μάθετε σε έναν βοηθό μια διαδικασία της εφαρμογής σας, όπως να συνοψίζει τα ληξιπρόθεσμα τιμολόγια ή να κλείνει ένα ticket και να ειδοποιεί τον υπεύθυνο. Ζητήστε το στη συνομιλία της εφαρμογής και το 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 };
  },
});

Backend functions, APIs και σήματα από την εφαρμογή

Κάθε αρχείο στο functions/ είναι προσβάσιμο στο /api/<name>. Συνδέστε APIs που το Agent UI δεν υποστηρίζει ακόμη, κρατήστε τα κλειδιά στα secrets και στείλτε μηνύματα από την εφαρμογή σε λειτουργία κατευθείαν στη συνομιλία δημιουργίας με το console.human.

  • Δοκιμάστε functions και διαβάστε τα logs τους από το CLI
  • Οι τιμές των secrets μένουν στον server
  • Ξεχωριστά περιβάλλοντα development, staging και production
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Ξεκινήστε δωρεάν

Βρείτε αυτό που θέλετε να φτιάξετε

Κάθε εργαλείο παρακάτω δουλεύει με τα δεδομένα που ήδη έχετε, με πρόσβαση βάσει ρόλων, πλήρες ιστορικό αλλαγών και έναν πραγματικό άνθρωπο στο πλευρό σας.

Όλες οι περιπτώσεις χρήσης →