Preface
LowCode table of solutions Drip-Table open source!
According to the latest forecast by Gartner, the world's leading information technology research and advisory firm, global IT spending will reach $4 trillion by 2021. Then China, as the economic powerhouse and IT powerhouse in Asia Pacific, the application development market in China will lead to an explosive period, with growth rates exceeding the global average in the coming years. With limited R&D resources, companies are more focused on saving labor costs and improving manpower efficiency, while most applications are inseparable from the list layout list demand is increasing day by day, and the types are complex and diverse, while R&D resources are limited, the existing development model is difficult to meet the growing demand. Therefore, Jingdong Retail iPaaS front-end R&D team launched a technical solution Drip-Table to build web list by LowCode, which can realize visual list building and save development manpower.
With nearly six months of continuous optimization and iteration, the framework has stabilized and is now open source.
- Source code address: https://github.com/JDFED/drip-table
- Official website address: http://drip-table.jd.com
Usage Scenarios
- no programming-based users want to build custom list application
- developers to efficiently create lists , customization requirements can be achieved through a small amount of code
How to use
First of all, we will show you our face through dynamic pictures.
You can also directly open the Drip-Table case for list building.
Introduction to the architecture solution
The overall process of the list is as follows: first use the Drip-Table-Generator visual builder to build the list, configure component properties, configure custom components if they cannot meet the business scenario, then write the rendering logic online with embedded template data, and finally generate JSON Schema protocol data. The list is dynamically rendered by Drip-Table renderer, and finally the business side can complete the list-related business requirements directly without development.
Introduction of Drip-Table-Generator architecture
Drip-Table-Generator is a visual list building solution.
Basic Capabilities of Drip-Table-Generator
So what are the basic capabilities that a good visual list building solution needs to have. It mainly contains the following 5 points：
- HTML Tree editing (style editing)
Edit the visible elements of the page, can freely modify the page structure style
- Component Tree editing (component editing)
Component list to select components, drag and drop to embed in the page
- Custom Development (custom development)
R & D can intervene in the development of custom components to meet the customization of the scene
- Data Editor (Data Editor)
Visually edit the data part of the page, such as text, URL
- Dynamic Logic Editor (Logic Editor)
The ability to freely add business judgment logic, such as checksum rules
List components and configuration
Basic components
The basic components are common components of the list, including text, graphics, labels and other components.
Business components
Business components usually serve only specific business, R&D can add custom business components according to the API methods exposed by Drip-table-generator.
Custom Components
Custom components solve the problem of not being able to manipulate data fields and not being able to verify syntax and logic. Build tools or through the online code editor allow users to write LowCode code to generate business components and then perform syntax checks and also use the preview feature for business logic checks; in addition, the code editor supports data manipulation through nested templates.
Json Schema Protocol Definition
The international specification (Understanding JSON Schema) is used to define the Json data format for global as well as list items. Through configuration items, we can decide to turn on or off certain functions, or set table styles, etc.
Introduction to Drip-Table architecture
Drip-Table is a Json Schema based solution for rendering dynamic lists.
The architecture is mainly divided into four JSON Schema definitions, namely Columns schema, Configs Schema, Refs, EventCallback, and also supports Drip-design and Antd-design theme packages.
- Columns schema defines the data specification of the list component.
- Configs Schema defines the list global configuration.
- Refs expose list instance parameters .
- Event callback defines the list framework event callbacks
Success stories
Drip-Table is used to build material lists for low-code projects in the drop-in platform. 64 kinds of material lists have been built, which efficiently support the needs of group promotions such as 11.11, and are stable for online use, saving 75% of R&D manpower.
Future development
Drip-table will focus on the list vertical, integrate the industry's common capabilities, empower various businesses, and save R&D resources.
We welcome you to use Drip-table and participate in co-build, and hope you can support us on github with a Star ~.
Reference material
Drip-Table source code address :
https://github.com/JDFED/drip-table
Drip-Table official website link:
http://drip-table.jd.com
Drip-Form official website link :
https://dripform.jd.com
Drip-Desgin official website link:
http://drip-design.jd.com
Micro-App official website link:
https://github.com/micro-zoe/micro-app
Communication to Official Wechat group
Top comments (0)