Agent UI dla programistów

Niech AI zbuduje aplikację. Do kodu zajrzysz, kiedy tylko zechcesz. Każda aplikacja ma własny serwer MCP, a CLI pozwala pobrać ją do edytora, pracować z asystentem kodowania i opublikować z powrotem.

npm install -g @agentuiai/cli

Wymaga Node.js w wersji 22 lub nowszej.

$ 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
Współpracuje z
  • Claude Code
  • Cursor
  • Codex
  • VS Code Copilot
  • ChatGPT
  • Windsurf
Wbudowane

Każda aplikacja ma własny serwer MCP.

Włącz go, a Claude, ChatGPT, Cursor czy dowolny klient MCP może w czyimś imieniu wyszukiwać i zmieniać dane Twojej aplikacji, widząc tylko to, co ta osoba ma prawo zobaczyć. Bez serwera do utrzymywania i bez pisania kodu.

  • Narzędzia danych generowane dla każdej tabeli: list, get, count, create, update i delete
  • Jeden adres na środowisko, domyślnie wyłączony, dopóki go nie włączysz
  • Połączenia tylko do odczytu albo do odczytu i zapisu, a każde możesz cofnąć
  • Reguły Data Security sprawdzane przy każdym wywołaniu
  • Poradniki i własne narzędzia, które uczą asystentów Twoich procedur
Jak włączyć MCP
  • data_orders_list
  • data_orders_get
  • data_orders_count
  • data_orders_create
  • data_orders_update
  • data_orders_delete
  • tool_summarize_overdue_invoices

Twoja aplikacja to po prostu folder

Zsynchronizuj aplikację, a dostaniesz jej prawdziwy kod: tabele danych jako JSON, strony, komponenty, funkcje backendowe i własne narzędzia AI. Pliki AGENTS.md i CLAUDE.md uczą Twojego asystenta kodowania, jak buduje się aplikacje Agent UI.

  • Edytuj w dowolnym edytorze
  • Sprawdzaj tym samym walidatorem, którego używa platforma
  • Publikuj i przebudowuj jednym poleceniem
acme-stock/
entities/ tabele danych jako JSON
pages/
components/
functions/ → /api/<name>
mcp/ własne narzędzia AI
Layout.jsx
AGENTS.md
.claude/CLAUDE.md

Pętla edycji

Zmieniaj pliki sam albo poproś o to asystenta. Sprawdź, porównaj i opublikuj w wybranym środowisku. Każde środowisko ma własną bazę danych.

  • 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

Połącz swojego asystenta przez MCP

Serwer MCP Agent UI pozwala Claude, ChatGPT, Cursorowi czy VS Code tworzyć aplikacje i tabele, odczytywać i aktualizować rekordy oraz uruchamiać procedury Twojej aplikacji, zawsze z uprawnieniami zalogowanej osoby. Nic do instalowania, żadnego klucza API do kopiowania.

Agent UI Apps

Twórz aplikacje z samymi danymi, projektuj ich tabele i dbaj o aktualność rekordów.

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

Twoja aplikacja

Jeden adres na środowisko, skopiowany z panelu asystentów AI w aplikacji. Widzi tylko to, co może zobaczyć zalogowany użytkownik.

Jak to włączyć →
$ claude mcp add --transport http agentui-apps https://api.agentui.ai/mcp/apps

O co możesz poprosić

  • Utwórz aplikację danych o nazwie Wizyty terenowe z tabelą Wizyty
  • Dodaj pole statusu, które może mieć tylko wartość zaplanowana, wykonana lub anulowana
  • Zaimportuj te 40 wierszy z arkusza, który wkleiłem
  • Pokaż wszystkie otwarte zamówienia powyżej 500
  • Oznacz otwarte zamówienia z zeszłego miesiąca jako opóźnione
  • Podsumuj zaległe faktury tego klienta

Własne narzędzia MCP

Naucz asystenta procedury z Twojej aplikacji, na przykład podsumowania zaległych faktur albo zamknięcia zgłoszenia z powiadomieniem właściciela. Poproś o to na czacie aplikacji, a Agent UI zapisze narzędzie jako plik w folderze mcp Twojej aplikacji.

  • Działa jako zalogowany użytkownik aplikacji
  • Reguły Data Security nadal obowiązują
  • Każde narzędzie włączasz i wyłączasz osobno
  • Agent UI pisze plik za Ciebie
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 };
  },
});

Funkcje backendowe, API i sygnały z aplikacji

Każdy plik w functions/ jest dostępny pod adresem /api/<name>. Podłączaj API, których Agent UI jeszcze nie obsługuje, trzymaj klucze w sekretach i wysyłaj wiadomości z działającej aplikacji prosto do czatu budowania za pomocą console.human.

  • Testuj funkcje i czytaj ich logi z poziomu CLI
  • Wartości sekretów zostają na serwerze
  • Oddzielne środowiska deweloperskie, testowe (staging) i produkcyjne
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 };
}

Zainstaluj CLI i pobierz swoją pierwszą aplikację.

npm install -g @agentuiai/cliDarmowe, na licencji MIT. Wymaga Node.js w wersji 22 lub nowszej.

Wybierz według tego, co chcesz zbudować

Każde z poniższych narzędzi działa na danych, które już masz, z dostępem opartym na rolach, pełnym logiem audytowym i prawdziwym człowiekiem, który pomaga.