Results for “json-render”

Build TanStack Start pages from JSON specifications. This skill connects URL routes, shared layouts, server-side data loading, page metadata such as titles, and client navigation, including loading, error, and missing-page displays.

• Build multiple pages from JSON specifications
• Share layouts across pages
• Connect dynamic URLs to page data loading

Generate PDF documents from JSON definitions with headings, tables, images, and page numbers. Use file, in-memory, or streaming output, and extend document layouts with custom components and externally managed application state.

• Generate invoice PDFs from JSON definitions
• Build documents containing tables and images
• Stream generated PDFs through an HTTP response

Turn JSON layout definitions into SVG or PNG images with Satori. Use this skill to create social sharing previews and cards, assemble standard layout and text components, or define custom components for image specifications.

• Creating social sharing preview images from JSON
• Building social cards with standard components
• Rendering AI-generated JSON image definitions

Define the structure and available components for AI-generated JSON screens or videos. Build generation prompts, process incremental updates, connect values to application state, and validate or repair definitions before passing them to a renderer.

• Define allowed components for AI-generated screens
• Build prompts for generating or editing JSON definitions
• Assemble definitions from streamed AI responses

Turn JSON screen descriptions into Svelte 5 interfaces. This skill covers component catalogs, registration, shared state, form bindings that keep inputs and data synchronized, conditional display, and streaming AI-generated interfaces as they arrive.

• Render a Svelte interface from JSON
• Define and register reusable screen components
• Synchronize form inputs with shared state

Create or update Claude skills that capture specialized knowledge and repeatable workflows. Guides the organization of instructions, scripts, references, and templates, then covers initialization, validation, and packaging into a distributable skill file.

• Turning recurring work into a reusable Claude skill
• Organizing internal knowledge and API instructions
• Revising an existing skill after practical use

Build videos in React with Remotion using topic-specific guidance and code examples. Covers animation, captions, audio, scene transitions, asset handling, timing, and text layout, with additional references for charts, maps, and 3D content.

• Create text animations and scene transitions
• Add captions and subtitles to videos
• Adjust audio, video clips, and display timing

Show results as interactive UI inside Codeg's chat (cards, tables, charts, tabs, accordions, badges, progress bars, simple forms) by writing a json-render spec code block in your reply. Use when the user invokes this skill or asks to see something as a card, table, chart, dashboard or other visual layout in Codeg.

The English summary is being prepared. Showing the original description.

Generate guardrailed UI from natural language. Emits constrained JSON that a Preact runtime renders. Use when the request is for a dashboard with metrics, charts, or tables; an admin panel; a data visualization interface; or a form-based application.

The English summary is being prepared. Showing the original description.

Build generative UI apps with OpenUI and OpenUI Lang — the token-efficient open standard for LLM-generated interfaces. Use when mentioning OpenUI, @openuidev, generative UI, streaming UI from LLMs, component libraries for AI, or replacing json-render/A2UI. Covers scaffolding, defineComponent, system prompts, the Renderer, and debugging OpenUI Lang output.

The English summary is being prepared. Showing the original description.