《论vue在前后端分离项目中的实践之年终总结》
我是2014年的时候开始了解知道的vue,当时vue还不太成熟,想用但是又怕自己hold不住,况且那时候vue还没有成熟的(路由、验证、ui组件)插件,社区也是不温不火的,再说也没有合适的机遇让我去项目中实践。
正好2015年9月离职了去了我朋友的一个移动互联部门,说好的只是做"前端开发"的工作,当时前端也就3个人,2个切图,没办法也就我主动的负责起了前端的架构设计这块的工作,当时接手的项目beta版本已经做了将近了50%的工作了,这是一个机场贵宾厅的服务型的产品应用,项目是用 $.load 页面方式做的前后端分离,这就是个坑,项目中用了几十个js类库,页面中随处可见的全局变量的污染,大家都是纯手拿到后端接口数据,拼接html 标签然后 append 到页面,看到这些我当时就有过想走的念头。
当时我没办法去改变所有的页面了,页面以及js文件太多了,而且项目工期真的很紧了,而我只能做的就是用vuejs做类库,给大家培训赶紧用上vuejs,把view层的坑给堵上,不过还好最终第一个beta版本上线了。
上线后立马迎来的是新版的1.0的工作,还不止这些还有后台项目的工作,这个时候我其实早已经开始琢磨着学习用 vueify+webpack+gulp 来做架构设计上面的工作了。
我想的是把(前台项目 和 后台项目 )的都做搭成工程化,我不想再让大家写重复的代码了,我们要做(ui组件 和 业务组件),以及全套的定制化的ui组件,我在团队中多次强调了我的憧憬,但是团队的现状就我一个人懂 vuejs,大家都很年轻,没太多经历,基本上就是jquery的思想。最后我想说基本上(架构设计 和 项目的组件哪块)都是我一个人完成的。 也如我所憧憬的那样,我做到了,只是这个过程真的太费力了,我基本每周末都得想着工作上面的事情。
我想对大家说的话:
对于那些说vue 只能做 view 层的工作的人,我只想说,我们的后台项目逻辑也很复杂,业务组件极其的多,其实我们后台前端就一个人做开发,而我只负责做复杂逻辑 和 组件,以及架构层面的事情,就完成了后台项目的开发,我们前台项目有三个人做ui切图制作,我负责做ui组件和架构设计方面的工作,大家经过了beta的vuejs 练手,以及逐渐的开始能用上vue了,我们用的是 vueify + vue-router 做的spa 架构。
对于那些即将用 vue 来做项目,以及还对vue 还怀有敬畏心的人说句,大家尽可放心使用,它已经日渐成熟了,社区已经非常的活跃。
其实我们三个月里,做了差不多4个项目,以下是我带团队做的项目架构和界面展示:
我之前的项目架构介绍文章:如何通过 Vue+Webpack 来做通用的前端组件化架构设计
前台架构设计 和 后台界面如下:



后台架构设计 和 后台界面如下:


总结:其实vue 也会有坑,任何架构都会有坑的,就是看你怎么去思考和解决它,我之后也会写一些关于vue坑的文章。我想说前端架构应该满足于团队内部的实力现状,否则它就会是你自己种下的恶果,时间不早了,晚安。
=====《最后发布一条招聘消息》=============:
“ 如果你有一颗想用代码来改变世界的信念,那么你来就对了”。
《论vue在前后端分离项目中的实践之年终总结》的更多相关文章
- 简单物联网:外网访问内网路由器下树莓派Flask服务器
最近做一个小东西,大概过程就是想在教室,宿舍控制实验室的一些设备. 已经在树莓上搭了一个轻量的flask服务器,在实验室的路由器下,任何设备都是可以访问的:但是有一些限制条件,比如我想在宿舍控制我种花 ...
- 利用ssh反向代理以及autossh实现从外网连接内网服务器
前言 最近遇到这样一个问题,我在实验室架设了一台服务器,给师弟或者小伙伴练习Linux用,然后平时在实验室这边直接连接是没有问题的,都是内网嘛.但是回到宿舍问题出来了,使用校园网的童鞋还是能连接上,使 ...
- 外网访问内网Docker容器
外网访问内网Docker容器 本地安装了Docker容器,只能在局域网内访问,怎样从外网也能访问本地Docker容器? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Docker容器 ...
- 外网访问内网SpringBoot
外网访问内网SpringBoot 本地安装了SpringBoot,只能在局域网内访问,怎样从外网也能访问本地SpringBoot? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装Java 1 ...
- 外网访问内网Elasticsearch WEB
外网访问内网Elasticsearch WEB 本地安装了Elasticsearch,只能在局域网内访问其WEB,怎样从外网也能访问本地Elasticsearch? 本文将介绍具体的实现步骤. 1. ...
- 怎样从外网访问内网Rails
外网访问内网Rails 本地安装了Rails,只能在局域网内访问,怎样从外网也能访问本地Rails? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Rails 默认安装的Rails端口 ...
- 怎样从外网访问内网Memcached数据库
外网访问内网Memcached数据库 本地安装了Memcached数据库,只能在局域网内访问,怎样从外网也能访问本地Memcached数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装 ...
- 怎样从外网访问内网CouchDB数据库
外网访问内网CouchDB数据库 本地安装了CouchDB数据库,只能在局域网内访问,怎样从外网也能访问本地CouchDB数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Cou ...
- 怎样从外网访问内网DB2数据库
外网访问内网DB2数据库 本地安装了DB2数据库,只能在局域网内访问,怎样从外网也能访问本地DB2数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动DB2数据库 默认安装的DB2 ...
- 怎样从外网访问内网OpenLDAP数据库
外网访问内网OpenLDAP数据库 本地安装了OpenLDAP数据库,只能在局域网内访问,怎样从外网也能访问本地OpenLDAP数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动 ...
随机推荐
- RNN/LSTM/GRU/seq2seq公式推导
概括:RNN 适用于处理序列数据用于预测,但却受到短时记忆的制约.LSTM 和 GRU 采用门结构来克服短时记忆的影响.门结构可以调节流经序列链的信息流.LSTM 和 GRU 被广泛地应用到语音识别. ...
- 6.C# 释放非托管资源2
C# 释放非托管资源 C#中资源分为托管资源和非托管资源. 托管资源由垃圾回收器控制如何释放,不需要程序员过多的考虑(当然也程序员也可以自己释放). 非托管资源需要自己编写代码来释放.那么编写好的释放 ...
- 用python.twisted.logfile每天记录日志,并用不记录stdout中的内容
#导入的头 from twisted.python import logfrom twisted.python.logfile import * #开始记录,输入日志名和存放的路径,setStdout ...
- Cocos Creator 键盘监听事件
键盘事件键盘.设备重力传感器此类全局事件是通过函数 cc.systemEvent.on(type, callback, target) 注册的.cc.SystemEvent.EventType.KEY ...
- java的输入输出
import java.util.Scanner; public class TestScanner { public static void main(String[] args) { Scanne ...
- PHP 中最全的设计模式(23种)
https://my.oschina.net/botkenni/blog/1603660 PHP 中最全的设计模式(23种) 原 botkenni 发布于 01/07 21:22 字数 8726 阅读 ...
- rpm方式安装MySQL5.1.73
1.安装MySQL server 首先下载好mysql的rpm安装包 使用rpm命令安装: rpm -ivh MySQL-server-5.1.73-1.glibc23.i386.rpm 命令解释:i ...
- Vue系列之 => 使用第三方animated.css动画
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Spark核心RDD:combineByKey函数详解
https://blog.csdn.net/jiangpeng59/article/details/52538254 为什么单独讲解combineByKey? 因为combineByKey是Spark ...
- 如何注销Sitecore CMS
登录Sitecore很容易,但是在旧版本的Sitecore中使用不同的界面,退出可能会给未经证实的人带来挑战. Sitecore 8 Sitecore 6和7 Sitecore 8 Sitecore ...