What is amis
amis is Baidu's open-source low-code front-end framework that rapidly generates various backend pages based on simple JSON configuration, without the need to write complex front-end code. amis supports features such as forms, tables, charts, and CRUD operations, provides a rich set of out-of-the-box components, offers high extensibility and flexibility, and supports easy integration into React or pure HTML projects. amis comes with a visual editor and supports enterprise-level features such as theme customization, internationalization, and permission management, helping developers efficiently build complex backend systems, improve development efficiency, and reduce development costs.
Main features of amis
- Page generation based on JSON configuration: Directly generates page elements (such as forms, tables, charts, CRUD lists, etc.) based on JSON strings, without writing front-end code. Provides a visual drag-and-drop editor, allowing users with no prior experience to get started quickly.
- Powerful low-code support: Supports enterprise-level features such as complex form validation, internationalization, and permission management. Provides form controls with custom fields, adaptive chart rendering, and other features to meet the needs of complex backend pages.
- High extensibility and flexibility: Provides a rich set of out-of-the-box components and supports theme and style customization. It has good compatibility, can be easily integrated into React or pure HTML projects, and supports secondary development.
- Enterprise-level feature support: Supports practical features such as file upload and PDF preview. Provides complete CRUD (create, read, update, delete) operation support, making it easy to build backend systems.
- Efficient development experience: Simplifies component-based development and supports real-time preview effects. Provides detailed development guides and testing processes, making it convenient for developers to get started quickly and maintain.
Technical principles of amis
- JSON-driven page rendering: Defines page structure and interaction logic based on JSON configuration. JSON data describes information such as page layout, component types, data binding, and event handling. After parsing the JSON configuration, the framework dynamically generates the corresponding HTML structure and bound events to implement page rendering and interaction.
- Component-based development: amis is based on the concept of component-based design and has a built-in rich component library (such as form controls, tables, charts, etc.). Developers can quickly build complex pages by combining components. Components use JSON configuration for data interaction and behavior control.
- TypeScript and SCSS: The framework core is written in TypeScript, ensuring code maintainability and extensibility. Style development is carried out based on SCSS, supporting theme and style customization to meet the design needs of different projects.
- Compatible with multiple front-end frameworks: Through encapsulation and adaptation, it seamlessly integrates into React, Vue, or pure HTML projects. It provides unified interfaces and configuration specifications, making it easy for developers to embed amis pages into existing projects.
- Visual editor: Provides a drag-and-drop UI editor, allowing users to generate JSON configuration through visual operations. The editor supports real-time preview, what you see is what you get, further lowering the threshold for low-code development.
Project address of amis
- Project official website：https://baidu.github.io/amis
- GitHub repository：https://github.com/baidu/amis
Application scenarios of amis
- Enterprise-level backend management systems: Quickly build backend systems such as user management and order management, support complex form validation and CRUD operations, and meet enterprise-level needs.
- Data visualization and reporting: Generate dashboards, reports, and charts with support for data binding and custom styles, suitable for quickly building data display pages.
- Rapid Prototyping: Quickly generate interface prototypes based on a visual editor, suitable for validating interaction logic and user experience during the product design phase.
- General-Purpose Form System: Build online forms, surveys, etc., providing rich form controls and validation features without the need to manually write code.
- Microservice Frontend Integration: In a microservice architecture, quickly integrate the frontend pages of multiple services based on JSON configuration, reducing repetitive development work.