Node.js躬行记(16)——活动配置化

简介:   一直想将一些常规活动抽象化,制作成可配置的。原先的计划是做成拖拽的,那种可视化搭建,运营也能自己搭建页面。  这是一个美好的愿景,但是现实不允许我花太多精力去制作这样一个系统。经过权衡后,先设计成一个可配置化的系统。  先对一类常用的打榜活动做定制化的设计,解决当前问题,立竿见影的提升工作效率。  先说说此系统的价值,当它完成后,受益方将包括设计组、Web组、产品组、QA组和数据分析组。

  一直想将一些常规活动抽象化,制作成可配置的。原先的计划是做成拖拽的,那种可视化搭建,运营也能自己搭建页面。

  这是一个美好的愿景,但是现实不允许我花太多精力去制作这样一个系统。经过权衡后,先设计成一个可配置化的系统。

  先对一类常用的打榜活动做定制化的设计,解决当前问题,立竿见影的提升工作效率。

  先说说此系统的价值,当它完成后,受益方将包括设计组、Web组、产品组、QA组和数据分析组。

  (1)设计组不用再考虑界面模块,只需将精力集中到配色和插图上。

  (2)产品组不用再跟进此类活动,她们可以置身事外,设计做好的图可以直接给配置人员。

  (3)QA组不用再过一遍测试,她们只要查看页面表现是否正常即可。

  (4)数据分析组不用再为每个活动手动制订报表,根据存储的信息,可自动生成。

  (5)Web组不用再投入人力去研发界面和接口了,只要页面稳定运行,都不用修线上BUG了。

  原先这么一个活动,人力时间包括2天开发,3天测试,1天产品,6天时间,而现在可以浓缩到几十分钟,大大提升了生产力。

  设计组虽然不会减少页面设计的时间,但是切图的时间绝对能少很多。

  数据分析组本来创建报表也不会费时间,但是会打断他们的工作,自动生成后,运营就完全不用找他们了。

  当然,第一版在人性化使用方面还是欠缺的,后期还有很大的优化空间。


一、规范


  为了完成这个系统,首先是要和各方通气,我直接拉了个会议,叫上相关人员,开了40分钟左右。

  会议中,最重要的是和设计组制定规范,包括图片尺寸、页面元素、字体颜色、间距等。


2.png


  其实之前与设计组制订过一次规范,这次是在之前的规范之上,再做进一步的完善和补充。

  与产品也要确定界面呈现,例如活动前样式、活动规则等都有多套显示方案,这些是统一还是作为配置的一部分,都要在动手前确认好。

  根据会上确认的规范,就可以开始设计界面了。


二、界面


  界面设计比较朴素,就是根据规范中需要的内容,设计输入框、下拉框等控件。


3.png


  其中图片管理是整个页面的核心,通过它,可以添加页面各个位置的图片,完成页面的搭建。

  本来是想设置成上传按钮的,但这样弹框会比较长,并且实现复杂度上会比较高,经过权衡后,还是使用了简单的文本框,将地址填入即可。

  列表页面设计的也很精简,为了方便查看活动,特地加上了预览按钮,鼠标移到预览按钮中,还可生成二维码,方便手机扫码查看。



三、存储


  原先计划是将数据存储于MongoDB中,因为存储的好几个字段都是JSON格式。

  若存储在MySQL中,那么在写入和读取时需要分别对其进行JSON序列化和反序列化。

  但是后面和数据组沟通,才了解到若要自动生成报表,那么他们就得读表,而MongoDB他们无法读取,之前没有连接,需要开发成本。

  为了众乐乐,最终决定存储于MySQL中,这样的话,数据组也不用额外开发了。

  这样的话,配置就完成了,但是活动页面的数据源是从另外的位置读取的。

  我们组会维护一个定时任务,5分钟读取一次服务端的接口,然后存储到指定缓存中,活动的数据源就是这个缓存数据。

  要完成这个活动系统,需要我们组三个人共同完成,由我负责管理后台的配置界面,另外一人完成活动的接口,还有一人编写H5页面。

相关文章
|
7月前
|
Web App开发 缓存 JavaScript
【安装指南】nodejs下载、安装与配置详细教程
这篇博文详细介绍了 Node.js 的下载、安装与配置过程,为初学者提供了清晰的指南。读者通过该教程可以轻松完成 Node.js 的安装,了解相关配置和基本操作。文章首先介绍了 Node.js 的背景和应用场景,随后详细说明了下载安装包、安装步骤以及配置环境变量的方法。作者用简洁明了的语言,配以步骤图示,使得读者能够轻松跟随教程完成操作。总的来说,这篇文章为初学者提供了一个友好的入门指南,使他们能够顺利开始使用 Node.js 进行开发。
1462 2
【安装指南】nodejs下载、安装与配置详细教程
|
1月前
|
存储 JavaScript 搜索推荐
Node框架的安装和配置方法
安装 Node 框架是进行 Node 开发的第一步,通过正确的安装和配置,可以为后续的开发工作提供良好的基础。在安装过程中,需要仔细阅读相关文档和提示,遇到问题及时解决,以确保安装顺利完成。
92 2
|
6月前
|
前端开发
windows10 安装node npm 等前端环境 并配置国内源
windows10 安装node npm 等前端环境 并配置国内源
356 3
|
3月前
|
前端开发 JavaScript 安全
node登陆接口权限配置cookie-parser、express-session
本文介绍了在Node.js中使用express-session和cookie-parser实现登录接口的权限配置,包括验证码接口的生成和自定义中间件的创建,用于验证用户权限。
34 0
node登陆接口权限配置cookie-parser、express-session
|
3月前
|
JavaScript 应用服务中间件 Linux
宝塔面板部署Vue项目、服务端Node___配置域名
本文介绍了如何使用宝塔面板在阿里云服务器上部署Vue项目和Node服务端项目,并配置域名。文章详细解释了安装宝塔面板、上传项目文件、使用pm2启动Node项目、Vue项目打包上传、以及通过Nginx配置域名和反向代理的步骤。
683 0
宝塔面板部署Vue项目、服务端Node___配置域名
|
5月前
|
缓存 JavaScript API
NodeJS代理配置指南:详细步骤和代码示例
**Node.js 代理配置:解决HTTP请求转发与CORS挑战** 在现代开发环境中,Node.js以其高效和灵活性深受青睐,但正确配置代理以处理跨域请求和API调用仍是复杂任务。本文提供全面指南,从基础到高级设置,教授如何在Node.js中使用代理,覆盖httpOptions、npm代理及第三方库的运用,以增强API调用灵活性。
NodeJS代理配置指南:详细步骤和代码示例
|
4月前
|
JavaScript IDE 前端开发
前端开发工具配置 nodejs & git & IDE
前端开发工具配置 nodejs & git & IDE
|
4月前
|
JavaScript Java Python
【Azure 应用服务】在Azure App Service for Windows 中部署Java/NodeJS/Python项目时,web.config的配置模板内容
【Azure 应用服务】在Azure App Service for Windows 中部署Java/NodeJS/Python项目时,web.config的配置模板内容
|
4月前
|
JavaScript Windows
记一下 Windows11 安装与配置 node.js 的标准步骤
这篇文章记录了在Windows 11系统上安装和配置Node.js的步骤,包括安装Node.js、验证安装、配置npm、设置npm镜像加速、全局安装cnpm并配置镜像、解决TLS连接不安全警告的详细过程。
506 0
|
6月前
Node历史版本下载及配置npm镜像
Node历史版本下载及配置npm镜像
585 1