vercel-labs/react-native

Renderizador React Native para json-render que transforma especificações JSON em UIs móveis nativas. Use ao trabalhar com @json-render/react-native, criar UIs React Native a partir de JSON, montar catálogos de componentes móveis ou renderizar especificações geradas por IA em dispositivos móveis.

O que é react-native?

Esta skill é um renderizador especializado para json-render, adaptado para o ecossistema React Native. Ela permite que desenvolvedores e agentes de IA transformem especificações JSON diretamente em interfaces de usuário móveis nativas, eliminando a necessidade de codificação manual. É particularmente útil em fluxos de trabalho que envolvem geração de UIs por IA, prototipagem rápida ou criação de catálogos de componentes reutilizáveis. Compatível com ambientes que utilizam @json-render/react-native, a skill processa definições JSON e as converte em componentes React Native funcionais, como Views, Text, ScrollViews e outros. Ao integrar essa skill, agentes de IA (como Claude Code, Cursor, Codex) podem gerar UIs móveis completas a partir de respostas estruturadas, agilizando o desenvolvimento de apps e a experimentação com layouts.

Funciona com~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/vercel-labs/json-render/tree/main/skills/react-native

Installed? Explore more Programação e Desenvolvimento skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

O que react-native faz?

Renderizador React Native para json-render que transforma especificações JSON em UIs móveis nativas. Use ao trabalhar com @json-render/react-native, criar UIs React Native a partir de JSON, montar catálogos de componentes móveis ou renderizar especificações geradas por IA em dispositivos móveis.

Individual skills in this repo

This repo contains 7 individual skills — each has its own dedicated page.

vercel-labs/core

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.

vercel-labs/react

React renderer for json-render that turns JSON specs into React components. Use when working with @json-render/react, building React UIs from JSON, creating component catalogs, or rendering AI-generated specs.

vercel-labs/react-pdf

React PDF renderer for json-render. Use when generating PDF documents from JSON specs, working with @json-render/react-pdf, or rendering specs to PDF buffers/streams/files.

vercel-labs/react-three-fiber

React Three Fiber 3D renderer for json-render. Use when working with @json-render/react-three-fiber, building 3D scenes from JSON specs, rendering meshes/lights/models/environments, or integrating Three.js with json-render catalogs.

vercel-labs/remotion

Remotion renderer for json-render that turns JSON timeline specs into videos. Use when working with @json-render/remotion, building video compositions from JSON, creating video catalogs, or rendering AI-generated video timelines.

vercel-labs/shadcn

Pre-built shadcn/ui components for json-render. Use when working with @json-render/shadcn, adding standard UI components to a catalog, or building web UIs with Radix UI + Tailwind CSS components.

vercel-labs/zustand

Zustand adapter for json-render's StateStore interface. Use when integrating json-render with Zustand for state management via @json-render/zustand.

Habilidades Relacionadas