Hasna
Official@hasna · United States of America
Offers a comprehensive suite for transforming structured JSON specifications into multi-framework UI components, multimedia assets, and enterprise-grade document generation.
Agent Skills by Hasna
Showing 49 vetted skills indexed across 2 GitHub repositories.
hasnadirectives
Provide pre-built utility directives for json-render UI catalogs.
hasnareact-email
Convert structured JSON UI specs into HTML and plain-text email output.
hasnaink
Convert JSON specifications into interactive terminal component trees.
hasnanext
Convert JSON UI specifications into Next.js applications with routing and SSR.
hasnaremotion-best-practices
Enforce render-safe Remotion video practices for animations, assets, and compositions.
hasnasvelte
Convert JSON UI specifications into Svelte 5 component trees.
hasnashadcn-svelte
Provide 36 Tailwind CSS-styled shadcn-svelte components for json-render catalogs.
hasnacore
Define schemas, component catalogs, and AI prompts for json-render UI generation.
hasnareact-native
Convert JSON UI specifications into native React Native component trees.
hasnavue
Render Vue 3 component trees from JSON UI specifications.
hasnareact-pdf
Generates PDF documents from structured JSON UI specifications using @react-pdf/renderer templates.
hasnashadcn
Integrates reusable UI components into your Tailwind and React projects via the managed screen reader.
hasnasolid
Render json-render UI specs into SolidJS component trees with reactive state.
hasnamcp
Set up MCP servers that render json-render component catalogs as interactive UIs.
hasnacodegen
Generate framework-specific code from json-render UI specification trees.
hasnaskill-creator
Generate and validate Claude skill directories with Python scripts and YAML frontmatter compliance.
hasnaxstate
Adapt @xstate/store atoms to json-render's StateStore interface.
hasnadevtools
Inspect and edit json-render spec trees and runtime state in-app across React, Vue, Svelte, and Solid frameworks.
hasnayaml
Parse streaming YAML UI specs into JSON Patch operations for json-render.
hasnazustand
Map Zustand vanilla stores to json-render's StateStore interface with typed adapters.
hasnajotai
Integrate Jotai atoms as a StateStore adapter for json-render UI.
hasnareact-three-fiber
Generate declarative 3D scenes from JSON specifications using React Three Fiber components.
hasnaredux
Create a Redux-compatible StateStore adapter for json-render's StateProvider.
hasnareact
Convert JSON UI specifications into React component trees with type-safe catalogs.
Frequently Asked Questions About Hasna
FAQPage SchemaWhat specific tasks can I perform using Hasna's UI generation capabilities?▼
You can convert structured JSON specifications into functional component trees for React, Vue, Svelte, SolidJS, and React Native. The system supports rendering interactive terminal components, Tailwind-styled shadcn-svelte catalogs, and declarative 3D scenes via React Three Fiber.
Which technical personas benefit most from these capabilities?▼
Frontend engineers, creative technologists, and full-stack developers benefit from these capabilities. The system is designed for those managing component catalogs, state-driven UI architectures, and those requiring rapid conversion of design specifications into multi-framework codebases.
What are the prerequisites for integrating these UI generation features?▼
Integration requires a defined JSON UI specification following the json-render schema. Users must have a compatible project environment for the target framework, such as Next.js for web applications or Remotion for video compositions, to map the generated output correctly.