公司项目思考

本文是个人对于现有项目的一些思考,仅做参考。

背景

  • 由于公司内部项目较多,项目组之间成员缺乏沟通,前端框架不统一,同一框架下UI框架选择也不尽相同。
  • 不同的业务系统相同的功能模块重复开发,导致人力成本增加,效率低下。
  • 相同项目组成员水平参差不齐,代码风格不统一,缺乏一定的规范。
  • 缺乏项目经验积累、开发规范、新人培训,试炼引导。
  • 开发过程中各部门缺乏沟通约定,各节点的产出没有一定的验收标准,不能保证每个环节的质量。

目的

  • 统一项目(后台管理系统)架构
  • 规范开发流程
  • 项目生命周期各个环节都要有相关的标准(文档规范、验收标准、项目评估机制、上线流程等)
  • 完善成员内部的培训机制、项目试练、技术分享、头脑风暴等方式提高成员的实力
  • 提高成员的主人翁意识,精益求精的态度,提高眼界,知识面。

方案

由于本人是做前端项目开发出生,并且长期做后台业务系统开发,所有的思考也基于此展开。

从以往的工作经验来看业务系统可以归纳为单/多业务系统聚合业务系统

  • 单/多业务系统:指一般的后台管理系统
  • 聚合业务系统:项目通常由很多业务系统组成,各个系统开发技术不一定相同,但是都有统一的UI,作为iframe嵌入到公共外壳系统中。

聚合型适用于业务复杂,多条业务线同时独立开发,很多电商网站后台都采用这种方式。

业务系统通用模块

这里列举了后台管理系统通用的模块及其细分类

权限模块

权限.gif

  • 登录

用户登录方式有很多种,像企业内部的Sass系统基本上都是员工在入职时分配好账号,初次登录后直接跳转到更改密码的页面。一些电商网站后台只要在外
登录后内部系统通常就不需要再次登录了。一般的网站后台则需要用户注册账户后再登录。

登录或者注册时的验证方式有很多种,大致归纳如下:

登录.gif

  • 授权

授权分为第三方授权,通常是微信、QQ、微博、知乎等常见应用直接共享信息登录系统后再完善一些用户信息。对于Sass系统来讲通常是直接分配账号,用户直接登录,从同一个入口进入的各业务子系统共享登录状态。

  • 权限分类与角色

角色通常来说就是管理员用户的区分,根据业务场景、地域跨度、公司人事体系的不同又可以细分出很多角色。不同的角色所能看到的,操作的功能是有所区别的。一般来说权限主要是从路由、功能点来控制的。

  • 验证

为了保证系统的安全性,需要一定的机制来保证系统不被恶意、非法登录修改信息。常见的手段为验证用户的邮箱、手机号、身份证验证、生物特征(面部)验证、常在登录地验证及各种形式的验证码验证。

会员模块

会员管理对于电商系统来说是很重要的一个功能点。很多电商项目都是围绕微信生态圏,因此会员也帖上了很多微信相关的标签。下面是一个常见会员信息的简单归纳:

会员.gif

评论模块

评论模块常见于CMS系统、商品评论。对于评论而主要的操作就是发表评论、回复评论、删除评论、评论点赞、评论审核、喜欢评论、收藏评论等。

营销模块

有了会员当然少不了各种营销手段来留住会员,获得手续收益和吸引更多会员。常见的线上营销方式如下:

营销.gif

消息模块

这里把短信、通知、公告信息全部归在一起。

分销模块

分销主要是电商的微商中,按照国家规定最多3级分销。

支付管理模块

支付系统主要是管理支付账单、支付流水记录、账单的投诉等。

订单管理

商品下单管理。

统计模块

主要是在客户端进行打点统计各pv, uv信息,以可视化图表展示用户增长、用户访问量等。

素材管理模块

各种商品图片、字体图标管理。

客服模块

客服系统,商户与用户聊天。

库存模块

页面生成模块

使用拖拽方式动态构建页面,适用于H5页面,微信公众号、小程序。

其它模块

特定行业、特殊需求功能模块。

实现方案

统一架构,前端采用 “脚手架 + 业务组件库 + 可视化配置”,中间考虑到各上业务系统的灵活对接可以采用nodejs作为中间层作调度,后端服务可以灵活选择。

前端基于Vue框架体系,采用 "Vue + Vuex + Typescript + GraphQL + Yarn + Lerna",脚手架使用 npm + vue-cli 来生成带有基础功能的基础项目,业务组件库在一定的规范和契约下单独成库进行开发,做到插件的形式载入和卸载。由于项目为Web端,不是桌面应用,因此可视化配置生成项目代码的可行性不切实际,只能生成配置数组,通过前端已有的功能组件来解析数组生成页面。

中间nodejs层主要负责认证、接口的转发与合并、资源的调度、后台系统的对接、日志的统计等。

基于这个方案可以将一些适用于多个项目的低层功能融入脚手架中,开发新的业务系统时可以直接开发特定的功能,一些通用的模块直接引入。

业务组件库可以直接放在主项目仓库作为一个package,也可以在公司内部自建npm仓库管理后台托管项目代码。

难点:

  • 插件式业务组件如何实现才能保证扩展性、灵活性、完整性
  • 脚手架生成的项目的粒度多大
  • 产品和设计师要严格按照UI规范设计产品
  • 项目代码如何保证统一的规范
  • 建立完整的业务组件开发流程文档
  • 各业务组件系统之间如何互通
  • 可视化配置生成的页面灵活性和适用性

你可能感兴趣的:(vue.js,前端设计)