首页
学习
活动
专区
工具
TVP
发布

VueJS-适合新手的前端框架

一入前端深似海,诚不我欺。

去年入坑Angular 2, 用两个晚上完成教学任务后,又用了将近两周才设置好一个脆弱的开发环境。之所以说脆弱,因为随便加减一个功能就差不多要把整个项目搞坏。

最近想做一个小的网页功能,即希望可以拥有前端的类MVVM开发体验,有不太愿意费太多时间在项目的设置上,VueJS就进入我的视线。

Vue主打的功能是“轻量级”和“渐进式”,非常适合小型web程序开发和原型开发。发布几年来,获得了大量开发者的认可和一个稳定且更新频繁的开源社区。

对于一个只需要简单的前端的小程序,Vue没有让我失望,一个小时入门,两个晚上完成了所需功能。因为是类似POC的小程序原型,所以没有太多关心css和架构,完全以快捷方便为主。基础功能完成后,只有两个文件,一个包含三个组件(component)的js,和一个不到20行的html。当然我的功能简单是一方面(一个计算新西兰技术移民打分的表格),另一方面也完全得益于Vue的这种灵活简单的开发体验。

当今最大的两个UI框架,无疑是Google的Angular,和Facebook的React。经过多年的发展,两者都毫无疑问非常成熟,社区也无比庞大。但Vue的优势,却在于这种渐进式开发体验,非常容易打动我这种前端新手。或许其他框架也可以更加接地气吧,但至少现在还没有这种迹象。

Angular官网的Get Started教程

Angular的教学模式,就像是一个高高在上的博士论文,虽然正确,但不免晦涩、生僻,非专业人士难以读懂。或更像是一种填鸭式教育,“不论如何,照我说的做,总有一天你会明白”。但事实是还没等我明白,我就已经放弃了。

与此相反,使用Vue的开发过程,更多以实用、简单为主。开始学习Vue,并不需要Node环境,直接创建一个HTML文件,加载Vue的CDN源文件,就可以开始入门啦!

在Hello Vue之后,教程里没有太多的废话,就直奔最常用的元素和了。至此,已然可以用JS的几个参数去操作UI渲染了!紧接着事件、绑定和模型则直接说明如何从UI到JS传数据。掌握了这几个关键字,就已经可以编写一个逻辑复杂的单页应用(SPA)了!

完全可以满足我的业务需求了!

当时学到这里我差点老泪纵横,单页应用的开发竟然可以这么简单!要知道,被Angular荼毒过以后,我已经不对高效快捷的前端开发抱有希望了啊!

再往后,所有的概念也都是水到渠成。比如是一个可复用的组件,是一系列动态计算的属性,用于传入属性等等。虽然还有一些偏晦涩的概念,比如,,什么的,完全属于锦上添花的东西,如果不是开发中大型项目,完全没有必要了解这些概念。

Vue另外让我更加惊喜的两个功能,一个是在console里直接对controller的操作,另一个是Chrome的DevTool插件。前者可以变相直接操作controller里的数据,后者则直接把Vue的DOM和对应数据树状呈现出来了!这种傻瓜式的开发体验,真是让人不喜欢都不行。

Vue.js Devtools

这一次用Vue开发单页应用的愉快体验,重新激发起了我web开发的兴趣。感谢Vue,和它的作者尤雨溪(Evan You)

PS: 后来,在这个Vue的版本上,我又进一步的尝试了Weex的跨平台web app开发和微信小程序的开发。两个方面都不是很顺利,这是后话,下回再表。

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20180611G1GSB400?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券