Q4要来了,我来这家公司已经一个季度了,通过对公司前端框架的整体认识,对业务的一些认识,发现,这些东西也都是可以重构,无论是v2,还是v3的代码。

首先就要那后台管理来开刀来,现有的技术框架就是php模版+jquery+jquery插件库,大杂烩什么都有,简单的说就是jquery技术栈,jquery灵活,但是代码量太大,没有太深入的思想,回调,dom操作,表单校验正则,dialog框,蒙层,表格编辑,查询分页,查询条件筛选,日期计算,无非就是这些东西。但是使用jquery的话,很坑,尤其是联动效果很多的时候就更坑了。我实在忍受不了,普普通通的一个表单,要写上1000行以上的代码。

进入重构,首先的问题是,后端渲染,为什么要做后端渲染,因为有时候会做google统计,seo优化,之类的,必须用后端渲染才行,普通的spa就不行了,而且语言包那一块需要去服务器拉去数据后才能生成文件,必须有后端服务做支撑,考虑这些,然后就入了nuxtjs的坑,nuxt是一种vue后端渲染方案,首先搭了一个nuxt服务,然后使用element,把menu组件改成了侧边栏,然后看了一下路由配置发现,这个路由就是根据文件的目录来判断,和php,java有的一拼,几乎是一样的,也支持动态路由,可匹配等,然后里面有server.js,client.js,分别打包客户端和服务端的代码,首页采用服务端渲染,其他页面则采用客户端渲染。

但是这样搭载过之后,我发现,后台管理系统里会有一些统计数据的工具,这时候可能会引入vue的图标框架,但是我不能确定vue的图表插件能否支持ssr

纠结之中我还是放弃了,如果以后有小的项目可以试一下。这次就别这样了,进度也要跟的上,况且都是内部人员使用的话对seo要求也不高,就选用spa,然后折腾了一下,发现vue-element-admin这个架口碑不错,进去看了一些,图标,表格,校验,菜单自适应,该有的都有,然后。。。。遇到了一个问题,没有服务端,语言包咋搞,总不能在前端代码里写吧,那就搭载一个子项目,专门搞权限,和语言包就行了,完美。

vue重构后台管理系统调研的更多相关文章

  1. vue+element-ui后台管理系统模板

    vue+element-ui后台管理系统模板 前端:基于vue2.0+或3.0+加上element-ui组件框架 后端:springboot+mybatis-plus写接口 通过Axios调用接口完成 ...

  2. 从零开始搭建vue+element-ui后台管理系统项目到上线

    前言 之前有些过移动端的项目搭建的文章,感觉不写个pc端管理系统老感觉少了点什么,最近公司项目比较多,恰巧要做一个申报系统的后台管理系统,鉴于对vue技术栈比较熟悉,所以考虑还是使用vue技术栈来做: ...

  3. vue开发后台管理系统小结

    最近工作需要用vue开发了后台管理系统,由于是第一次开发后台管理系统,中间也遇到了一些坑,想在这里做个总结,也算是对于自己工作的一个肯定.我们金融性质的网站所以就不将代码贴出来哈 一.项目概述 首先工 ...

  4. vue开发后台管理系统有感

    使用vue开发后台近一个月,今天终于完成得差不多了,期间也遇到很多的问题,所以利用现在的闲暇时间做个总结 使用element-ui基础,这次使用了vue-element-admin(github地址) ...

  5. vue之后台管理系统遇到的几个痛点

    杂七杂八的一些日总结 1.vue(最)合理的处理表单提交和初始化表单数据显示的方式 对于表单处理,繁琐的一个地方就是当出现多个下拉选择的表单框的时候,我们需要进行多次将选择的文本去换对应的id值的操作 ...

  6. vue写后台管理系统问题概述和解决方案

    一个不错的Demo; http://xmall.exrick.cn/#/home 源码:https://gitee.com/Exrick/xmall-front/blob/master/src/pag ...

  7. Vue3教程:Vue 3 + Element Plus + Vite 2 的后台管理系统开源啦

    之前发布过一篇文章<Vue3教程:开发一个 Vue 3 + element-plus 的后台管理系统>,文中提到会开发并开源一个 Vue 3 + Element Plus 的项目供大家练手 ...

  8. React版/Vue版都齐了,开源一套【特别】的后台管理系统...

    本项目主要基于Elux+Antd构建,包含React版本和Vue版本,旨在提供给大家一个简单基础.开箱即用的后台管理系统通用模版,主要包含运行环境.脚手架.代码风格.基本Layout.状态管理.路由管 ...

  9. ASP.NET MVC5+EF6+EasyUI 后台管理系统(58)-DAL层重构

    系列目录 前言:这是对本文系统一次重要的革新,很久就想要重构数据访问层了,数据访问层重复代码太多.主要集中增删该查每个模块都有,所以本次是为封装相同接口方法 如果你想了解怎么重构普通的接口DAL层请查 ...

随机推荐

  1. jQuery的节点操作

    1.创建节点 var aa = $("<div id='cccc'>插入的内容</div>") var bb = $("<a href='h ...

  2. 721. Accounts Merge合并电子邮件账户

    [抄题]: Given a list accounts, each element accounts[i] is a list of strings, where the first element  ...

  3. 使用MySQLMTOP监控MySQL性能

    一.服务器角色 服务器角色 172.18.35.29 10.160.22.14 (MySQL Master) 10.160.22.47 (MySQL Slave) 监控点 YES NO NO 被监控点 ...

  4. FZU 1977 Pandora adventure (DP)

    题意:给定一个图,X表示不能走,O表示必须要走,*表示可走可不走,问你多少种走的法,使得形成一个回路. 析: 代码如下: #pragma comment(linker, "/STACK:10 ...

  5. struct 和union的区别

    union ( 共用体):构造数据类型,也叫联合体  用途:使几个不同类型的变量共占一段内存(相互覆盖) struct ( 结构体 ):是一种构造类型 用途: 把不同的数据组合成一个整体——自定义数据 ...

  6. struct pollfd

    struct pollfd 2010年04月15日 星期四 下午 03:59 int poll (struct pollfd *fds, size_t nfds , int timeout); str ...

  7. java并发编程实战:第八章----线程池的使用

    一.在任务和执行策略之间隐性耦合 Executor框架将任务的提交和它的执行策略解耦开来.虽然Executor框架为制定和修改执行策略提供了相当大的灵活性,但并非所有的任务都能适用所有的执行策略. 依 ...

  8. EBS增加客制应用CUX:Custom Application

    1. 创建数据库文件和帐号 [root@ebs12vis oracle]# su - oracle[oracle@ebs12vis ~]$ sqlplus / as sysdba SQL*Plus: ...

  9. Python学习-11.Python中的类定义

    Python是一门面向对象语言,那么作为面向对象的特征——类也是有的.值得注意的是Python中一切皆对象,并不像C#中为了性能考虑,int这些在Python中也是对象.(C#中int是结构体) 如何 ...

  10. md1

    a b link to baidu 我不懂啊 这是什么意思 http://example.com/ 这里是一段代码' adsfasdf 你 你输得算好了 反正就这样吧,大概也值能这样了注 我想写一段引 ...