34 个 · 按相关度排序
Helps connect json-render to a writable Jotai atom, a unit that holds application state. Covers adapter setup and sharing a Jotai store so json-render and React components read and update the same values.
中文简介正在准备中。当前显示英语简介。
Connect json-render interfaces to XState Store for state management. The skill shows how to adapt an atom, a container holding application state, so json-render reads and writes through it.
中文简介正在准备中。当前显示英语简介。
Connect json-render to Redux or Redux Toolkit so UI state reads and writes use a Redux store. The skill explains how to select the relevant state and dispatch actions that replace it when updates occur.
中文简介正在准备中。当前显示英语简介。
Helps connect json-render to a Zustand store, where application values are managed. Covers sharing the entire store or selecting a nested portion, with configurable update behavior for the selected state.
中文简介正在准备中。当前显示英语简介。
Add and troubleshoot the json-render inspection panel in SolidJS applications. This skill covers panel setup for examining specifications, editing state, reviewing action and stream timelines, browsing component catalogs, and selecting page elements for inspection.
中文简介正在准备中。当前显示英语简介。
Add and configure an inspection panel for Vue json-render apps. This skill guides setup and troubleshooting so you can inspect UI definitions, edit state, review action and stream timelines, browse catalogs, and select page elements.
中文简介正在准备中。当前显示英语简介。
Add and troubleshoot a developer panel in Svelte 5 json-render apps. Inspect JSON screen definitions, edit application state, review action and streaming timelines, browse component catalogs, and select elements directly from the page.
中文简介正在准备中。当前显示英语简介。
Set up an inspection panel in React json-render apps to examine UI definitions, edit state, and review action and stream timelines. The skill also covers opening or toggling the panel and recording events from React code.
中文简介正在准备中。当前显示英语简介。
Build MCP Apps that display interactive json-render interfaces inside clients such as Claude and ChatGPT. The skill covers a Node.js server, a React view, and packaging the interface into a single HTML file.
中文简介正在准备中。当前显示英语简介。
Helps integrate YAML output into json-render, turning incoming text into incremental UI updates. Covers prompt generation, streaming parsing, and targeted edits to existing UI specifications through merge, patch, or diff formats.
中文简介正在准备中。当前显示英语简介。
Build 3D scenes in React from JSON specifications using json-render. The skill covers shapes, lighting, model loading, materials, cameras, and view controls, plus connecting component definitions to their rendering implementations.
中文简介正在准备中。当前显示英语简介。
Build interactive terminal interfaces from JSON specifications with @json-render/ink. The skill covers standard and custom components, input handling, state connections, conditional display, and progressively rendering specifications generated by AI.
中文简介正在准备中。当前显示英语简介。
Turn json-render specifications into SolidJS interfaces. This skill guides component registration, connects inputs to application state, handles actions and validation, and helps troubleshoot how changing values update the screen, including streamed UI generation.
中文简介正在准备中。当前显示英语简介。
Build multi-page Next.js applications from JSON specifications. This skill guides route setup, shared layouts, page metadata, and server-side rendering, which prepares pages on the server, with optional data loading before display.
中文简介正在准备中。当前显示英语简介。
Helps build custom code exporters from json-render UI specifications. Covers walking the UI tree, collecting components, state references, and actions, and formatting property values for JSX, the markup syntax used in React.
中文简介正在准备中。当前显示英语简介。
Build Vue 3 interfaces from JSON specifications, including AI-generated layouts. The skill covers component registration, named content areas, synchronized form values, conditional visibility, validation, actions, and connections to external state management.
中文简介正在准备中。当前显示英语简介。
Debug json-render interfaces with an inspector panel that shows screen specifications, editable runtime state, action history, and streamed updates. Select a rendered page element to locate its definition and investigate display or interaction problems.
中文简介正在准备中。当前显示英语简介。
Build json-render interfaces with 36 ready-made UI components, including forms, tables, and navigation. This skill guides component selection, connects definitions to React implementations, and explains custom components and input validation.
中文简介正在准备中。当前显示英语简介。
Build Svelte interfaces for json-render using 36 ready-made components. This skill guides component selection, connects component definitions to implementations, and explains form validation settings for apps using Svelte 5 and Tailwind CSS.
中文简介正在准备中。当前显示英语简介。
Add formatting, arithmetic, text processing, and translated labels to json-render specifications. This skill explains ready-made directives, or value-processing rules, how to combine them, and how to define custom rules for application-specific transformations.
中文简介正在准备中。当前显示英语简介。
Turn JSON timelines into Remotion video compositions with titles, images, text overlays, and animated statistics. The skill covers playback setup, reusable video components, transitions, effects, and adding custom clips to a video catalog.
中文简介正在准备中。当前显示英语简介。
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.
中文简介正在准备中。当前显示英语简介。
Build native mobile interfaces from JSON specifications with @json-render/react-native. Use standard or custom components, connect form inputs to application state, and update visible content in response to taps and other interactions.
中文简介正在准备中。当前显示英语简介。
Turn JSON specifications into React interfaces using a catalog of available components. This skill helps connect component implementations, shared data, form inputs, conditional display, and user actions to render interactive screens, including AI-generated designs.
中文简介正在准备中。当前显示英语简介。