Vue.js----火的发紫,烫的烧手

前段时间,公司要求做一个小程序,没多少经验的我,一边看文档一边学习,硬是吭哧吭哧做出来,我也挺佩服我这个小白的,
但是我发现开发小程序都是用的微信原生的API和一些第三方组件,一向追求技术顶端的我心里略有不甘,
一个偶然的机会知道了一个叫vue.js的前端框架,并且在论坛的活跃度也很高,这引起了我的注意,经过初步的摸索,以下是我的个人心得:
一:Vue.js的作者为Evan You(尤雨溪),曾任职于Google Creative Lab,Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,并且非常容易学习,只要你会HTML、CSS 和 JavaScript ,再去搞vue问题都不大

二:Vue可以做从简单到复杂的前端单页应用,随处可见的Web前端都可以用Vue来开发。而且Vue上手速度快、功能强大,且提供了非常好用的脚手架vue-cli,很简单就可以构建并让自己的项目跑起来。
Vue.js有声明式,响应式的数据绑定,与组件化的开发,并且还使用了Virtual DOM这个看名字就觉得高大上的技术。

三:为什么要用组件开发?现在我们做单页应用,页面交互和结构十分复杂,一个页面上就有许许多多的模块需要编写,而且往往一个模块的代码量和工作量就非常庞大,如果还按照原先的方法来开发,那么会累死人。而且遇到以后的产品需求变更,修改起来也非常麻烦,生怕动了其中一个div之后,其他div跟着雪崩,整个页面全部乱套,或者由于JavaScript的事件冒泡机制,导致修改一些内层的DOM事件处理函数之后,出现各种莫名其妙的诡异BUG。

四:前端打包工具webpack: 前端代码为什么要打包呢?因为单页应用程序中用到很多素材,如果每一个素材都通过在HTML中以src属性或者link来引入,那么请求一个页面的时候,可能浏览器就要发起十多次请求,往往请求的这些资源都是一些脚本代码或者很小的图片,这些资源本身才几k,下载连1秒都不需要,但是由于HTTP是应用层协议,它的下层是TCP这个运输层协议,TCP的握手和挥手过程消耗的时间可能比下载资源本身还要长,所以需要把这些小文件全部打包成一个文件,这样只要一次TCP握手和挥手的过程,就把多个资源给下载下来了,并且多个资源由于都是共享一个HTTP请求,所以head等部分也是共享的,相当于形成了规模效应,让网页展现更快,用户体验更好。

五:脚手架:Vue-CLi! 它是一个vue.js的脚手架工具。说白了就是一个自动帮你生成好项目目录,配置好Webpack,以及各种依赖包的工具,它可以通过 npm install vue-cli -g 的方式安装,后面的-g表示全局安装的意思,意味着你可以打开命令行之后直接通过vue命令调用它。

六:组件化开发:还记得在传统前端开发的时候,我们都是每个人做一个页面,然后最后套入各种后端模版引擎,比如说PHP的Smarty或者Java的JSP等等。但是现在我们做单页应用,页面交互和结构十分复杂,一个页面上就有许许多多的模块需要编写,而且往往一个模块的代码量和工作量就非常庞大,如果还按照原先的方法来开发,那么会累死人。而且遇到以后的产品需求变更,修改起来也非常麻烦,生怕动了其中一个div之后,其他div跟着雪崩,整个页面全部乱套,或者由于JavaScript的事件冒泡机制,导致修改一些内层的DOM事件处理函数之后,出现各种莫名其妙的诡异BUG。
在面向对象编程中,我们可以使用面向对象的思想将各种模块打包成类或者把一个大的业务模块拆分成更多更小的几个类。在面向过程编程中,我们也可以把一些大功能拆分成许多函数,然后分配给不同的人来开发。
在前端应用,我们是否也可以像编程一样把模块封装呢?这就引入了组件化开发的思想。
Vue.js通过组件,把一个单页应用中的各种模块拆分到一个一个单独的组件(component)中,我们只要先在父级应用中写好各种组件标签(占坑),并且在组件标签中写好要传入组件的参数(就像给函数传入参数一样,这个参数叫做组件的属性),然后再分别写好各种组件的实现(填坑),然后整个应用就算做完了。

七:学会vue,你也就算大半个前端程序员了,同时美团也退出mpvue,开发模式和vue是一模一样,也就是说,你可以通过mpview来开发小程序,不用再借助微信开发工具去开发原生的小程序了,只需要用比如强大的vscode开发,然后通过命令行编译然后通过微信开发工具编译运行即可看到效果,
同时阿里巴巴也推出一个weex的开发框架用来开发APP,同时兼容iOS安卓,也就是可以通过前端的开发技术vue就可以开发native级别的APP

好了,我要接着学习去了,如果出入,请留言

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值