react drag
1.0.0
(This project is the author's graduation design)
Through related research on visual editing systems, thinking about business scenarios, abstraction and splitting of components, etc. We are committed to solving the problems of few front-end developers, more page demands, more repetitive requirements, and low reusability. Implement a system based on react-based front-end visualization platform. The platform can provide users with the function of visually editing front-end pages and generating corresponding react codes. For technicians, it is available to create a universal page building platform.
The front-end part of this system uses React technology as the view framework. The system uses the UMI framework for routing control and uses DV for state management. The front-end relies on Node.js as the middle layer for rendering on the server, thereby further improving the rendering speed of the first screen of the page. In the front-end display part, it is completed through pages, layouts, and components. In the state management section, cooperate with models and connect the views to the data through connect in dva. At the same time, for front-end requests, they are implemented through the services layer. Place some commonly used methods under utils as toolsets. Put variables with special meanings in common.
The modules of this system mainly include five major modules: user management, organizational management, page drag and drop editing, page preview and export, and component management. Among them, since JWT is used as the front and back end login authentication method, the user authentication module is added. The core functional process of the system is that the user logs into the system, enters the visual page editing area, selects components to edit, saves the page to the server, builds relevant code, and packages to generate corresponding compressed packages.
