1. Project Overview

Low-code development for R&D teams, freeing smart developers from repetitive wheel-building tasks so they can focus on innovation and creating business value.

What Is PagePlug?

PagePlug is the China-localized version of Appsmith. It is an open-source, declarative, visual frontend low-code framework that can be used to build web applications and WeChat Mini Programs.

2. Open Source License

Licensed under Apache-2.0

3. Screenshots

How Is PagePlug Different from Other Low-Code Platforms?

PagePlug targets a different user group from other low-code platforms on the market (such as Qingflow, Yida, Weida, Jiandaoyun, Qingflow, and Huozige). The latter are more oriented toward non-programmers, allowing business teams to build applications independently. PagePlug, on the other hand, is designed for To D development teams. It aims to accelerate the development process and simplify the development of internal systems and tools.

Like other no-code and low-code platforms, PagePlug aims to make it easier for people to create applications and automate workflows. However, it offers more powerful and flexible API integration and data management capabilities. It connects directly to data sources (API, DB) without requiring modifications to the customer's architecture. Any backend data can be converted into JS variables, which can then be freely transformed and configured in any view component. Therefore, PagePlug may be a better choice for users who require a higher degree of customization and more extensive operational capabilities.

Key Features

• More Powerful Visual Modeling Tools

PagePlug provides highly intuitive and flexible visual modeling tools, including tables, charts, forms, buttons, and more. These components have been optimized and tested to meet most business requirements, reducing developers' workloads and eliminating extensive coding and testing. Developers can easily drag, drop, and configure various components as needed to create custom forms, reports, and applications without repeatedly writing complex code. The entire software system is also easier to maintain.

• Broader API Support

PagePlug supports integration with a wide range of third-party APIs, including data storage, message queues, file uploads, and more. This allows developers to integrate various capabilities more easily and seamlessly connect them with their own applications, extending application functionality.

• More Comprehensive Data Management Features

PagePlug provides powerful data management tools that allow users to easily write and execute SQL queries and manage databases, tables, and other data resources. Compared with other low-code platforms, PagePlug connects to APIs and database servers without manual configuration, with full support from its built-in engine.

• Greater Extensibility

PagePlug allows custom code written in JavaScript to be used anywhere in the application. It also supports adding third-party JS libraries, making it easy to customize components and control logic to better meet personalized requirements.

• Better Security Support

PagePlug provides extensive security features, including authentication, authorization, encryption, and auditing, helping ensure that your applications are secure and reliable.

Differences from Appsmith

• Based on Appsmith, with comprehensive Chinese localization and performance optimizations, providing a better user experience.

Simplified startup procedures and support for local development in Windows environments (without WSL). The official Appsmith frontend project has a complicated initial startup process with numerous dependencies. Furthermore, official support for local Windows development relies on WSL, making configuration very complicated!

• Introduces the antd component library, supports Antd5, and upgrades React to v17.
• A rich collection of mobile components with mobile support! Build a Mini Program in one minute and generate a Mini Program QR code for sharing!

• A faster and simpler charting solution: Echarts

• Integrates Formily, a leading solution in the form development ecosystem.

4. Feature Overview

PagePlug is the China-localized version of Appsmith. Based on Appsmith, it provides comprehensive performance optimizations and Chinese localization, while also integrating specialized solutions such as Formily for forms, Echarts for charts, and low-code Mini Program development. It is an open-source, declarative, visual frontend low-code framework designed for developers, with an intuitive development experience that aligns with developers' expectations.

How Is PagePlug Different from Other Low-Code Platforms?

PagePlug targets a different user group from other low-code platforms on the market (such as Qingflow, Yida, Weida, Jiandaoyun, Qingflow, and Huozige). The latter are more oriented toward non-programmers, allowing business teams to build applications independently. PagePlug, on the other hand, is designed for To D development teams. It aims to accelerate the development process and simplify the development of internal systems and tools.

Like other no-code and low-code platforms, PagePlug aims to make it easier for people to create applications and automate workflows. However, it offers more powerful and flexible API integration and data management capabilities. It connects directly to data sources (API, DB) without requiring modifications to the customer's architecture. Any backend data can be converted into JS variables, which can then be freely transformed and configured in any view component. Therefore, PagePlug may be a better choice for users who require a higher degree of customization and more extensive operational capabilities.

5. Tech Stack

Private Deployment [Docker] (Recommended)

Minimum Server Requirements: 4 GB RAM + 2 CPU Cores

 Local Development

PagePlug source code is located in the /app directory. The main directories are:

• /client -- React frontend project, generated using the create-react-app scaffolding tool, responsible for the low-code editor and web frontend display.
• /server -- Java backend project using the Spring WebFlux framework, responsible for low-code backend services and proxying various data sources.
• /taro -- Taro mobile project, using the Taro cross-platform solution to parse and display low-code DSL on mobile devices.

Starting the PagePlug Frontend

The PagePlug frontend project uses Nginx as its gateway, and Nginx runs in Docker. Therefore, make sure Docker is installed before running it. The startup commands below are intended only for the Windows environment. For non-Windows environments, please refer to the official guide.

// Configure host
127.0.0.1 dev.appsmith.com

// Environment variables
cp .env.example .env

// Start the local Nginx Docker container
cd app/client
yarn start-proxy

// Start the frontend service
yarn
yarn start-win

After successfully starting the application, visit [https://dev.appsmith.com](https://dev.appsmith.com) to preview the result.

Starting the PagePlug Backend

Starting the PagePlug backend requires JDK 11, Maven 3, a Mongo instance, and a Redis instance. For detailed instructions, please refer to the official guide. The startup commands below are intended only for the Windows environment. On Windows, scripts must be run using the bash command. On non-Windows environments, you can run the scripts directly.

note:: The build.sh script uses the rsync tool. Make sure rsync is installed on your system before starting. For instructions on installing rsync in a Windows environment, see here.

// Open the project in IDEA
app/server

// Create the environment variable file
cp envs/dev.env.example .env

// Open .env and configure the environment variables
APPSMITH_MONGODB_URI="Your MongoDB instance address"
APPSMITH_REDIS_URL="Your Redis instance address"

// [Optional] If you need the mini-program preview feature, configure your mini-program information
CLOUDOS_WECHAT_APPID=""
CLOUDOS_WECHAT_SECRET=""

// Build the Java service
mvn clean compile
bash ./build.sh -DskipTests

// Start the Java service
bash ./scripts/start-dev-server.sh

Starting the PagePlug Mobile App

PagePlug Mobile is a Taro project that natively supports multiple platforms, including mini-programs, H5, and React Native. However, PagePlug currently only supports WeChat Mini Programs. Previewing and publishing WeChat Mini Programs requires WeChat Developer Tools and a mini-program account. Before development, please refer to the official WeChat Mini Program guidelines.

PagePlug Mobile components are built using the Taroify UI component library.

cd app/taro

Open config/dev.js to configure the development parameters

// PagePlug backend API address. During local development, enter your machine's local IP address
API_BASE_URL: '"[http://192.168.xxx.xxx:8080/api/\](http://192.168.xxx.xxx:8080/api/\)"'

// Default application ID displayed in the mini-program
DEFAULT_APP: '"Application ID"'

// Start the Taro project
yarn
yarn dev:weapp

Thanks to These Pioneers

We would like to thank the talented open-source projects used in PagePlug. These projects help make the world a better place!

• Appsmith (Low-Code Prototyping)
• Taro (Cross-Platform Mobile Development Solution)
• Formily (Form Solution)
• Taroify (Taro UI Component Library)
• React Vant (React Version of the Vant Component Library)