# tencent/tmagic-editor

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/tencent-tmagic-editor).**

4,921 stars · 799 forks · TypeScript · NOASSERTION

## Links

- GitHub: https://github.com/Tencent/tmagic-editor
- awesome-repositories: https://awesome-repositories.com/repository/tencent-tmagic-editor.md

## Description

tmagic-editor is a low-code development platform and visual page builder used for designing frontend user interfaces through a visual canvas and component library. It functions as a frontend UI orchestrator that defines page structures and a schema-driven form generator that interprets structured data to create interactive user forms.

The system employs a cross-framework component adapter to ensure consistent rendering across different frontend environments. It uses visual-to-JSON layout serialization to translate interface movements into persistent structured data, which is then processed by a runtime layout interpretation engine to instantiate live components.

The platform covers frontend component orchestration and schema-driven form generation, utilizing metadata-based form generation and state-based property synchronization to link the visual canvas with configuration panels.

## Tags

### Web Development

- [No-Code Page Builders](https://awesome-repositories.com/f/web-development/no-code-page-builders.md) — Provides a visual environment for assembling functional web pages using predefined blocks and widgets without manual coding.
- [Frontend Component Orchestrators](https://awesome-repositories.com/f/web-development/frontend-component-orchestrators.md) — Manages and renders visual layouts across different frontend frameworks using a unified design system.
- [Frontend UI Orchestrators](https://awesome-repositories.com/f/web-development/frontend-ui-orchestrators.md) — Defines visual page structures that can be rendered across different frontend frameworks.
- [Layout Interpreters](https://awesome-repositories.com/f/web-development/backend-development/web-frameworks/rendering-and-layout-architectures/component-based-page-layouts/layout-engines/layout-interpreters.md) — Provides a client-side engine that instantiates live components by interpreting saved layout definitions at execution time.
- [Framework Component Adapters](https://awesome-repositories.com/f/web-development/framework-integrations/framework-component-adapters.md) — Implements a wrapper layer to ensure UI components remain consistent when rendered across different frontend framework environments.
- [JSON to Page Rendering](https://awesome-repositories.com/f/web-development/json-apis/json-based-page-schemas/json-to-page-rendering.md) — Processes structured JSON layout definitions into a rendered visual tree of functional frontend components.

### Artificial Intelligence & ML

- [Schema-Driven Forms](https://awesome-repositories.com/f/artificial-intelligence-ml/human-feedback-collection/schema-driven-forms.md) — Creates interactive user forms by interpreting structured data definitions of fields and layouts.

### Development Tools & Productivity

- [Low-Code Development Platforms](https://awesome-repositories.com/f/development-tools-productivity/low-code-development-platforms.md) — Offers a visual development environment for building functional frontend applications with minimal manual coding.

### Software Engineering & Architecture

- [Automatic Form Generation](https://awesome-repositories.com/f/software-engineering-architecture/schema-based-state-validation/form-validation-schemas/automatic-form-generation.md) — Automatically generates interactive input fields and validation logic by parsing predefined data model schemas.

### User Interface & Experience

- [Visual Page Builders](https://awesome-repositories.com/f/user-interface-experience/visual-page-builders.md) — Provides a drag-and-drop editor for designing user interfaces and pages via a visual canvas and component library.
- [Visual UI Designers](https://awesome-repositories.com/f/user-interface-experience/visual-ui-designers.md) — Offers a graphical tool for constructing user interfaces using visual components that render across different environments. ([source](https://tencent.github.io/tmagic-editor/docs/index.html](https://tencent.github.io/tmagic-editor/docs/index.html))
- [Declarative Layout Serializers](https://awesome-repositories.com/f/user-interface-experience/drag-and-drop-layout-engines/declarative-layout-serializers.md) — Serializes drag-and-drop interface movements on a visual canvas into a persistent declarative JSON tree.
- [Layout Rendering Engines](https://awesome-repositories.com/f/user-interface-experience/layout-rendering-engines.md) — Transforms custom layout definitions into functional live pages using a compatible runtime environment. ([source](https://github.com/tencent/tmagic-editor#readme))

### Part of an Awesome List

- [Visual Page Builders](https://awesome-repositories.com/f/awesome-lists/devtools/visual-page-builders.md) — Visual editor for building web pages with a focus on component orchestration.
- [Vue3 项目](https://awesome-repositories.com/f/awesome-lists/more/vue3.md) — Listed in the “Vue3 项目” section of the Great Open Source Project awesome list.
