Front-end component management platform developed based on Vue Family Bucket

Background of the project

The background of the project is that in an outsourcing website building company, a large number of reusable components are accumulated in the design process. Designers often only need to fine-tune the components to piece together the page and deliver it to the front end. In theory, these components can also be reused in the front end, but In fact, the front end has to re-implement the entire page every time, which wastes a lot of manpower.

Functional Requirements

The idea of ​​this project is to develop all components and input them into a unified platform for management. Designers can go to the platform to select components, and preview and adjust the components in real time. What you see is what you get during the whole process, and the platform will make adjustments As a result, a string of code is generated. As long as the code is handed over to the front-end, you can use this string of code to reproduce the component modified by the designer on the platform. You can also copy the html/css/js code of the component with one click and quickly apply it to the project. Go, making the front-end development cost of the component part close to zero. The platform needs to implement the following functions:

* Management component, supports classification, search, and sorting

* Display components and support online preview/editing of components

* Component handover, supports generating component code and reproducing components based on code

* Usage statistics, support statistical component usage, to facilitate further optimization of components

Technology stack

Vue+Vue-router+Vuex

Project Preview

Front-end component management platform

Source code

Github

The above is the detailed content of Front-end component management platform developed based on Vue Family Bucket. For more information, please follow other related articles on the PHP Chinese website!