您现在的位置是:首页 > 文章详情

为什么说Web开发和Vue.js是如此的有趣?

日期:2018-07-23点击:382

Web Vue.js

我想告诉你,我开始享受使用Vue.js和进行前端开发的故事。这不应该被理解为一篇关于为什么Vue.js可能比React,Angular或任何你正在考虑的其他Web框架更好的文章。Vuejs是令人惊叹的,但我们生活在一个作为前端开发人员同样令人惊叹的时代。

如果你几年前和我交谈过,我会把自己定位为一个后端开发人员,掌握服务器和数据库管理。面向对象的语言,java和c #,我想找到一种自己需要交付程序时使用的唯一的开发语言,我逐渐了解到更多关于.NET和SQL服务器的堆栈技术。当时我有这样一个概念,前端开发者只是使用右脑的附庸风雅的人,并不是“真正的”编程。

但是,在我最后一次求职,选择很少。特别是工作面试,我看到了自己是如何失败的。那次失败非常令人沮丧,但我从中吸取了不少教训。我获得了一个职位,利用了我在SharePoint的经验。我在SharePoint的经验并不特别:用GUI、工作流等设计页面这个不是我理想中的工作,而是为了生活不得不做的工作。

当我刚开始的时候,我接触过像我过去做过的任何类似的项目。我依靠GUI设计用户界面。幸运的是,使用数据库的经验使我能够以规范化的方式设计列表,但似乎缺乏用户界面方面的功能。在SharePoint设计器中,即使修改了底层ASP,某些效果也很难实现。

我和一个很棒的开发人员进行了讨论,这真的触动了我,于是我开始了进入前端框架的旅程。她说:“你知道…SharePoint支持REST服务。”啊,是的!我可以在SharePoint上使用Ajax,并根据响应情况建立我的HTML。这将是超级有趣的!

我们的第一次迭代的一个特定的应用**xmlhttprequests,**通过JavaScript函数构建HTML。这种方法的连接如此之多以至于我们的函数和字符串变得越来越难维护。所以,我想知道这个问题是否有一个更好的通用的解决方案。

当然有!欢迎阅读“Why you should use framework X”的视频和博客。在做了教程和观看关于这个主题的辩论之后,我拒绝使用框架。毕竟,使用一个框架意味着每个人都必须变得聪明起来。然而,研究框架的过程中,我碰到Handlebars,模板引擎使用的Ember。

所以,我们做了任何明智的团队都会做的事。我们重写了项目使用该模板引擎。除了显式调用编译函数之外,这是一次不错的体验。最初的渲染完全没有问题。不过,我们需要添加在项目列表中折叠/展开某些项的能力。我的这个问题的第一种方法是给我的对象设置一个“visible”的属性,当属性的值发生了变化那么就重新编译模版。这意味着数百个元素必须根据变化重新渲染。我们利用jQuery来应用处理程序,它可以基于某些选择器显示/隐藏元素。

我觉得这很混乱。最终产品是功能性的,但是我能在一个月内完成代码并维护它吗?可能需要一年?如果不费力气的话。请允许我借此机会说,可维护的代码写了大量使用jQuery和Handlebars。在这一点上,我没有能力把它搞到位。

所以,我就想回去研究一下可用的框架。有这么多好的框架可选,但我们有一个独特的环境。我们不能使用node。没有NPM,没有工具被大量使用在每一个框架。我们得出的结论是,在浏览器中运行Babel也会降低性能。考虑到这些条件,React、Ember和Angular2 +是不可行的选项。

我们没有认真考虑AngularJS(1)。我已经用它实现了另一个项目,但它已不被官方支持了,并且vue.js刚刚发布了V2版本和一个清晰的在浏览器使用的路径。它会继续受到欢迎,并且有可用的工具。所以,如果我们不失时机的使用它,包括一个它提供的工具时,我们也就决定支持它了。

为什么是Vue.js,好玩吗?

许多我所给的原因可以归因于Vue的替代品。

模板

最初使我对vue.js感兴趣的是模板。使用一些花括号,我可以根据JavaScript访问的变量将值插入到提交内容中。通过模板的使用等于提供了一个路径,Vue.js DOM和组件模板更容易被使用。另外,没有太关注在IE9 +使用vue.js,而IE不支持模板。

响应性

事实上,我可以对我们的模型进行更改,它会自动更新页面上的内容,这也是为什么让我觉得angular.js好用的原因。类似的原来“ng-model”模型,vue.js提供了一个“V”的指令可以很容易的把输入内容显示出来。使用watchers,这种响应扩展到执行操作不一定与页面上发生的事情相关。

组件

虽然你不使用组件也可以利用Vue的响应和模板,但组件化的体系结构的实现是真的很有趣。学习如何将行为封装到组件中是很有趣的,它使我能够高效地分割代码。类似于生活在C #世界在哪里类需要做的太多了,我意识到当一个组件可能做的太多了。这种做法在某种程度上激发了智力,刺激了编程时的感觉。

为什么觉得前端这么有趣?

作为一个孩子,我的梦想就是编程。确切地说是什么?桌面应用程序和游戏。当我开始从事真正的编程工作时,我真的很想从事那种我的工作使别人很受益的。我不知道你,但直到最近,我有一个先入为主的概念“真正的程序员”层次结构,看起来像是这样。

  • 真正的程序员

  • 操作系统/内核程序员

  • 桌面应用程序

  • 游戏程序员

  • 后端网络程序员

  • 前端网络程序员

  • SharePoint /销售人员/其他平台程序员

  • 微软Office(Access / Excel)程序员

  • 不是真正的程序员

这种想法真的让我觉得自己是个做后台的人,更不用说前端了。在很长很长的一段时间里,甚至在许多地方,前端和后台两者都是同一个人来做。这导致了对前端较少关注,导致产生了很多低质量的站点。随后,公司开始雇用前端的人,以美元为单位得到他们的费用。这份工作名声不太好,我不想和那个名声有任何关系。

然而,如前所述,我发现自己处于一个需要依靠前端满足需求的尴尬位置。令我惊讶的是,浏览器的编程不仅有趣,而且功能齐全。

浏览器的能力

我总是惊讶于浏览器能处理什么。即使是可怜的老Internet Explorer,也可以在不调用服务器的情况下处理读取、解析和创建Excel文件。画布和SVG给我们两个超级有用的方法来创造美丽和动态的图像/动画。使用Ajax,我们可以创建周期性地、无缝地向用户更新的动态内容。

分享就是快乐

在客户端开发时如果没有隐藏你的源代码。它在那里让世界都可以看到。所以,也不震惊,JavaScript的项目在很大程度体现在GitHub上。此外,许多项目是麻省理工学院,Apache,或其他许可非常友好。**Score!**来自令人敬畏的人的贡献帮助我以更快、更有意义的方式为我的公司做出贡献。

即时满足

与桌面应用程序开发类似,我们常常以可视化的方式看到代码的影响。我们可以使用CSS和视觉上有吸引力的站点的一点天赋,来改善我们作为开发者在我们的老板和用户中的印象。再加上一个视觉框架Twitter的Bootstrap或者Bulma,我们真的可以减少时间而增加一些吸引力。

Write Once Run Everywhere

旧的java web开发说跑起来比java本身要更真实。使代码兼容多个浏览器和针对不同屏幕大小的布局同样面临挑战。这些挑战本身很有趣,因为这让我们了解了各种平台。

JavaScript

JavaScript继续以极快的速度发展,但它是一种非常有趣的语言。从“= =”和“= = =”差异中体会函数处理类原型继承功能的编程方法,学习这种语言已经超好玩。能够将新的功能Babel到我的网站(项目)就更是屌爆了一样。

总结一下

作为前端Web开发人员,我可以与职场中的优秀人员一起工作,并在更大的开发人员社区中获得对我想法的反馈。你为什么喜欢前端开发?你觉得Vue.js怎么样?

感谢阅读!

Denny Headrick是一个Web开发者,他喜欢的工作方式太多。在各种顶级平台上进行Vue.js讨论的时候可以看到他,他喜欢偶尔博客一下。你可以跟他推特@dennythecoder。

汇智网小智翻译(小智工作的网站,欢迎大家吐槽 ! www.hubwiz.com)

我也分享个 vue.js 全家桶课程:

  1. vue.js 入门与提高 http://xc.hubwiz.com/course/592ee9b2b343f27b0ae1ba99?affid=20180319oschina
  2. vuex 2 入门与提高 http://xc.hubwiz.com/course/597d463fff52d0da7e3e397a?affid=20180319oschina
  3. vue-router 入门与提高 http://xc.hubwiz.com/course/5983d3aeff52d0da7e3e3d50?affid=20180319oschina
  4. vue.js 工程化实践 http://xc.hubwiz.com/course/598bad66c7fd1d49453979c9?affid=20180319oschina

原文发布时间为:2018年01月19日
原文作者:笔阁 

本文来源:开源中国 如需转载请联系原作者

原文链接:https://yq.aliyun.com/articles/617983
关注公众号

低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。

持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。

转载内容版权归作者及来源网站所有,本站原创内容转载请注明来源。

文章评论

共有0条评论来说两句吧...

文章二维码

扫描即可查看该文章

点击排行

推荐阅读

最新文章