Toolverse
All skills

json-render-core

by vercel-labs

Core package for defining schemas, catalogs, and AI prompt generation for json-render. Use when working with @json-render/core, defining schemas, creating catalogs, or building JSON specs for UI/video generation.

Installation

Pick a client and clone the repository into its skills directory.

Installation

Quick info

Category
Frontend
Views
20

About this skill

Core package for defining schemas, catalogs, and AI prompt generation for json-render. Use when working with @json-render/core, defining schemas, creating catalogs, or building JSON specs for UI/video generation.

How to use

  1. Zainstaluj pakiet @json-render/core w swoim projekcie Node.js lub TypeScript.
  2. Zdefiniuj schemat za pomocą funkcji defineSchema, opisując strukturę specyfikacji i katalogów — określ, jakie pola i typy będą w Twoim JSON-ie.
  3. Stwórz katalog komponentów za pomocą defineCatalog, mapując nazwy komponentów (np. Button, Card) na ich właściwości i opisy — każdy komponent powinien mieć zdefiniowane propsy za pomocą Zod.
  4. Wygeneruj systemowy prompt dla AI, wywołując metodę prompt() na katalogu — możesz dodać niestandardowe reguły, jeśli chcesz wpłynąć na sposób generowania specyfikacji.
  5. Jeśli chcesz obsługiwać streaming odpowiedzi od AI, użyj createSpecStreamCompiler do przetwarzania przychodowych chunków JSONL i budowania finalnej specyfikacji krok po kroku.
  6. Przekaż wygenerowany prompt do modelu AI (Claude, GPT itp.), a otrzymasz JSON zgodny z Twoim schematem, który możesz renderować jako interfejs lub wideo.

Related skills