The WYSIWYG designer of App Studio is a tool provided to assist in developing frontend pages. It provides common webpage components that allow you to create frontend pages by simple drag-and-drop operations. This topic describes the features of the WYSIWYG designer.
Use a compatible framework
The WYSIWYG designer is compatible with React, Angular, and Vue because it uses a common description language to describe the properties such as structures, appearances, and actions of pages at the underlying layer.
Integrate a simple data processing method to meet complex interaction needs
App Studio integrates a global state management solution to manage page data and associate components.
Provide the code mode to build complex interactive pages
The WYSIWYG designer uses the common structured description language domain-specific language (DSL) at the intermediate layer to switch between the visualized drag-and-drop mode and code mode. You can directly edit the code based on DSL. This feature brings the advanced user experience for high-end developers.
Visually configure component association
The WYSIWYG designer allows you to visually link parameters of components to associate them.
Publish and run pages without building
App Studio compiles the intermediate DSL code online into the code that can be directly run in the browser for page rendering.
Connect to DataService Studio of DataWorks and quickly integrate data APIs
App Studio seamlessly connects to DataService Studio APIs of DataWorks, allowing you to debug the APIs in real time.
Provide abundant components and templates
App Studio provides abundant components. You can also customize components and upload them to the component library.
In addition, App Studio provides abundant templates. You can quickly create a page based on a template. You can also save the created page as a template and publish it to the template market for use by others.