Code generators that convert abstract UIDL definitions into React, Vue, Angular, and other framework components and projects.
Teleport Code Generators is a set of open-source tools that convert abstract UI definitions (UIDL) into framework-specific code for React, Vue, Angular, and other web technologies. It solves the problem of manually translating visual designs or platform-agnostic specs into production-ready components and projects, enabling faster development cycles and consistent output across multiple targets.
Frontend developers and teams working with low-code platforms, design-to-code workflows, or multi-framework projects who need to automate UI component and project generation.
Developers choose Teleport Code Generators for its extensible, abstract-first approach that decouples UI definition from implementation, allowing generation of high-quality, framework-specific code from a single source while maintaining full customization and plugin capabilities.
A collection of code generators for modern JavaScript applications
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.
Generates production-ready code for React, Vue, Angular, Next.js, and more from a single UIDL source, as highlighted in the key features and quick setup examples.
Uses the UIDL JSON schema to define interfaces independently of frameworks, enabling consistent design-to-code workflows and bridging visual design with implementation.
Supports custom plugins, mappings, and post-processors, allowing developers to tailor output to specific project needs, as detailed in the ecosystem and documentation links.
Focuses on generating clean, maintainable code with considerations for performance and accessibility, aligning with the project philosophy stated in the README.
The project is labeled as beta (v0.21.12) with experimental parts like the HTML generator, indicating potential instability and breaking changes before the official v1.0 release.
Requires installing multiple npm packages, understanding the UIDL structure, and configuring generators, which can be a barrier for quick adoption compared to simpler scaffolding tools.
While UIDL supports basic state and events, complex scenarios like server-side rendering or advanced state management may need custom extensions, as hinted in the capabilities section.