使用React制作一个可配置的页面生成器[0]

Posted 2020-08-19 jiasm

背景

上班两年多，终于来到一家互联网公司，告别之前的朝九晚六的腐败生活，开始了11116的码农之旅。

因为公司做的是直播相关的业务，所以伴随着直播，不定期的就会有运营活动-.-

但是这类活动留给码农的开发周期都不太长，上半年比较激烈，基本一个月要上个三四个的活动。。。

由于这些活动页面基本类似，所以就萌生了做一个能够让运营、产品、设计同学直接去通过界面操作配置来生成一个活动页面。（其实是我下半年的KPI了...）

于是就有了本项目。（目前项目刚刚起步）

需要实现的功能

     1. 有一个操作界面来进行组件的添加修改

     2. 可以针对组件来配置数据的来源

     3. 发布配置好的页面到线上环境

由于自己是写Node的，所以做起来比较舒服，不会涉及到前后端沟通的障碍。。。

待系统完工后的页面上线流程大致为：

     1. 新建页面

     2. 配置组件，绑定数据来源

     3. 点击发布

     4. 将本次配置生成一个json文件推到活动页面的展示服务器上并将配置存入mysql中备份

     5. ...后续步骤暂时省略，就是拿到json配置后的生成router相关事宜了

目前实现的功能

     1. 添加组件、组件中添加组件

     2. 改变组件的位置

     3. 删除组件

     4. 编辑组件的属性和样式

目前有两个可以看到效果的组件。。Container和Text

预计11月15日会实现一个较为完整的配置系统、11月20日实现上线部署相关事宜。

项目地址： https://github.com/Precursors/ultron-stage