json-render: Open-Source-Framework für generative Benutzeroberflächen

Repositoryvercel-labs/json-renderTool

json-render ist ein TypeScript-basiertes Generative-UI-Framework von Vercel Labs, das dynamische Benutzeroberflächen aus Prompts mittels vordefinierter Komponenten und Schemas erzeugt.

Das Wichtigste

  1. Generative Benutzeroberflächen werden durch vorab definierte Komponentenkataloge und Aktionen abgesichert, sodass die KI nur freigegebene Elemente nutzen kann.
  2. Die Ausgabe erfolgt als schema-konformes JSON und unterstützt progressives Streaming während der Modellausgabe.
  3. Umfassende Plattform- und Framework-Unterstützung für React, React Native, Vue, Svelte, SolidJS, Next.js, Ink (Terminal), React Three Fiber (3D), Remotion (Video), React PDF und React Email.
  4. Enthält 36 vorgefertigte Komponenten auf Basis von shadcn/ui.

Warum das relevant ist

Unkontrollierte KI-Code-Generierung im Frontend birgt Sicherheits- und Darstellungsrisiken. Ein schema-basierter Ansatz mit festen Komponenten begrenzt den Gestaltungsspielraum von LLMs auf ein validiertes Designsystem.

Einordnung

Das Projekt löst das Zuverlässigkeitsproblem generativer Interfaces: Statt freien Code zu generieren, liefert das Modell strukturiertes JSON, das an eine Typschnittstelle (z. B. via Zod) gebunden ist. Technisch setzt es auf TypeScript und modulare Adapterpakete für gängige UI-Frameworks, PDFs, E-Mails und 3D-Szenen. Die Zielgruppe umfasst Entwicklerteams, die LLM-gesteuerte Interfaces in bestehende Applikationen einbetten wollen. Mit über 16.000 Sternen, Apache-2.0-Lizenz und Vercel Labs als Urheber weist das Framework bereits eine breite Akzeptanz im Ökosystem auf.

Gefunden in

Zusammenfassung von KI erstellt (Gemini 3.8 Flash, 27. September 2026). Sie kann Fehler enthalten – maßgeblich ist die Originalquelle.

Inhaltlich ähnlich, ermittelt über die KI-Suche.

  • Link:Chris Tate

    Generative UI in Chat-SDK-Agenten mit json-render streamen

    Vercel integriert json-render in das Chat SDK, um generative UI-Elemente direkt in Chat-Plattformen zu streamen. Ein typisierter Komponenten-Katalog erzeugt plattformnative Nachrichten wie Slack Block Kit oder Teams Adaptive Cards. Das erleichtert die Ausgabe strukturierter Antworten für AI-Bots.

    KI & AI· Ankündigung

  • X-Post:Guillermo Rauch

    Generative UI in Slack und Teams via AI SDK, Chat SDK und json-render

    Vercel ermöglicht mit json-render gestreamte generative Benutzeroberflächen für Chat-SDK-Agenten. Sprachmodelle erzeugen typisierte JSON-Spezifikationen, die automatisch in native UI-Elemente wie Slack Block Kit oder Microsoft Teams Adaptive Cards gerendert werden. Guillermo Rauch bezeichnet diesen Ansatz als künftiges dominantes Paradigma für die Interaktion zwischen Mensch und Agenten.

    2563Lesezeichen162.998Aufrufe

    KI & AI· Ankündigung

  • X-Post:Chris Tate

    json-render/chat: Generative UI für Slack und Microsoft Teams

    Chris Tate hat json-render/chat vorgestellt, ein Werkzeug für generative Benutzeroberflächen in Messenger-Diensten wie Slack und Teams. KI-Agenten erzeugen damit native Karten mit interaktiven Elementen, Tabellen und Diagrammen. Die UI-Komponenten streamen live während der Modellausgabe über ein einheitliches Schema für das Chat SDK.

    5056Lesezeichen240.442Aufrufe

    KI & AI· Ankündigung

  • Repository:shadcn-ui/chatbot-template

    shadcn/ui Chatbot-Template: Minimaler AI-Chat mit Vercel AI Gateway

    Das offizielle Chatbot-Template von shadcn/ui bietet eine schlanke Referenzimplementierung für moderne KI-Chat-Oberflächen. Es basiert auf Next.js, dem Vercel AI SDK sowie UI-Komponenten aus dem shadcn-Ökosystem und bindet Modelle über das Vercel AI Gateway an.

    910SterneTypeScript

    KI & AI· Tool

  • Repository:vercel/ai

    Vercel AI SDK: Provider-agnostisches TypeScript-Toolkit für KI-Anwendungen und Agenten

    Das AI SDK von Vercel ist eine quelloffene TypeScript-Bibliothek zur Entwicklung von KI-Anwendungen und autonomen Agenten. Es bietet eine einheitliche Schnittstelle für Modelle verschiedener Anbieter wie OpenAI, Anthropic und Google und lässt sich nahtlos in Frameworks wie Next.js, React, Svelte, Vue und Angular einbinden.

    26.588SterneTypeScript

    KI & AI· Tool

Lassen Sie uns über Ihr Projekt sprechen

Standorte

  • Mattersburg
    Johann Nepomuk Bergerstraße 7/2/14
    7210 Mattersburg, Austria
  • Wien
    Ungargasse 64-66/3/404
    1030 Wien, Austria

Dieser Inhalt wurde teilweise mithilfe von KI erstellt.