一、VueJs 填坑日记之基础概念知识解释

概述 在最开始听说vuejs这个词是在2016年,当时天真的认为自己是个后端开发工程师不需要学习太多的前端知识,不过紧接着在2017年在公司就用到了vuejs。对于初学者(尤其是干后端的初学者)来说,刚接触时,有好多思路都很难理解。

本来写这一系列博客,只是为了记录自己在这一段时间学习vuejs的成果。如果有何纰漏请大家多多理解,不喜勿喷…

再说,在目前互联网的调整发展情况下,javascript更是在快速的更新迭代,如今对前端工程师来说,需要会的不只有css+div,js+jq了。近年来,javascript各界大神也发布了很多优秀的框架,如安哥拉(angularjs),Reactjs等。而vuejs更是由国人大神【尤雨溪(Evan You)】主导开发并得到了业界认可的优秀框架。

因此,综合上述种种,本人决定以该系列博客来记录自己的学习过程及问题,在写作时由于本人方案功底薄弱,写的不好希望大家多多见谅。在学习时,参考了另一篇特别好的博客,以下有些内容也借鉴而来,忠心感谢FungLeo,是你们无私的奉献,才让我们有了学习的参考,以下是地址: http://blog.csdn.net/fungleo/article/details/77575077

基本理念 本文将通过vue-cli+axois+amaze ui+jquery来搭建一个小型的后台管理系统,数据来源使用cnode.js 的公开 api接口。由于该项目属于小型项目,所以不涉及vuex等知识。

前后端分离开发模式 在N年前,我们开发web项目的流程是: 1、设计师设计页面 2、美工将设计稿通过css+div切片成html的页面 3、后端工程师拿切好的html页面 在这种开发模式上有明显的缺点,就是页面出现哪怕只是特别小的问题或是修改很小的功能,也需要前后端工程互相协调开发。对后端工程师来说,并不能更专注的去实现业务逻辑。 所以近年出现在前后端分离开发模式,如下: 1、设计师设计页面 2、前端、后端、测试等其它开发人员约定接口规范(形成接口文档) 3、前端工程师按接口文档来开发前端(前期可模拟接口返回的数据模型)来进行前端的开发 4、后端工程师按接口文档开开发相应接口 与几年前相比,对前端工程师的要求无疑提高了很多,如如何调用接口等。对后端工程师来说却可以更专注的实现业务逻辑。

时代在发展,困难如弹簧,你强它就弱,你弱它就强。所以为了不被时代所淘汰,努力吧!

单页应用程序(SPA) 单页Web应用(single page web application,SPA),就是只有一张Web页面的应用,是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序。 要想更好的学习SPA,需要大家先了解一下锚点链接: HTML中的链接,正确的说法应该称作"锚点",它命名锚点链接(也叫书签链接)常常用于那些内容庞大繁琐的网页,通过点击命名锚点,不仅让我们能指向文档,还能指向页面里的特定段落,更能当作"精准链接"的便利工具,让链接对象接近焦点。便于浏览者查看网页内容。类似于我们阅读书籍时的目录页码或章回提示。在需要指定到页面的特定部分时,标记锚点是最佳的方法。 更多关于锚点链接的解释请参见: https://baike.baidu.com/item/%E9%94%9A%E7%82%B9%E9%93%BE%E6%8E%A5/7472012?fr=aladdin 为什么要用锚点链接,原因是锚点链接并不会使页面进行跳转或刷新。以我们的 vue 项目为例,它的本地 url 结构一般为以下格式: http://localhost:8080/#/Inbox 可以明显的看到我们所谓的路由地址是在 # 号后面的,也就是利用了锚点的特性。

RESTful 风格接口 URI表示资源的两种方式:资源集合、单个资源。如下: 资源集合: /zoos //所有动物园 /zoos/1/animals //id为1的动物园中的所有动物 单个资源: /zoos/1 //id为1的动物园 /zoos/1;2;3 //id为1,2,3的动物园 更多关于RESTful 风格接口的解释请参见: http://blog.csdn.net/yue7603835/article/details/52536497

VUE是什么? 目前业界主流的前端三大框架:angular、react、vue,目前angular正处于新旧交替所以不选择,剩下的两个都非常优秀,但是vue的学习成本要比react低好多。同样都优秀的框架,我们选择vue,只因为两个字“简单”。

vuejs是一个前端框架,并不只是官网下载下来的一个vue.js文件。官方的解释: Vue.js (读音 /vjuː/,类似于 view) 是一套构建用户界面的渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,它不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与单文件组件和 Vue 生态系统支持的库结合使用时,Vue 也完全能够为复杂的单页应用程序提供驱动。 如果你是有经验的前端开发者,想知道 Vue.js 与其它库/框架的区别,查看对比其它框架。 更多关于vuejs的解释请参见: https://cn.vuejs.org/v2/guide/

在上面提到了Vue的核心库,我们来看一下都有哪些核心库,如下: 1、vue.js 核心,不解释。 2、VueRouter2 实现路由组织工具。 3、webpack 项目打包以及编译工具。 4、nodejs 前端开发环境。 5、npm 前端包管理器。 6、axios ajax 接口请求工具。 7、sass-loader 和 node-sass css 预处理。 8、element 基于 vue 的后台组件库。 9、iview 基于 vue 的另一套后台组件库。 10、vue-cli vue 项目脚手架。一键安装 vue 全家桶的工具。

命令行的重要性 在学习vue时,我们会经常用到一些命令,如npm install、npm run dev等,这是vue-cli对我们提供的一些命令,现在的前端,不会点命令出去找工作都不好意思说自己是前端了。希望在初学vue或其它前端框架时,不要抵触命令行,因为它 1、更好 2、更快 3、更强 4、更装逼

第一篇文章,基本没有代码,接下来我们就要开始慢慢的揭露vue神秘的面纱了。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏数据和云

从一个故障案例看强大到令人发紫的Oracle数据库--我和数据中心的故事

作为一名混迹数据库江湖十几年的老DBA,当你对关系型数据库的了解越来越深入时,你会发现,Oracle数据库真的是强大到令人发紫! Oracle数据库的强大,不仅...

2714
来自专栏闰土大叔

在没有DOM操作的日子里,我是怎么熬过来的(终结篇)

前言 在我写终结篇的日子里,Vue版本稳定在2.9.1。当我摸清Vue的脉络之后,以一个爬坑无数的亲历者的身份,谈谈我在MVVM时代里遇到的那些事儿。 接下来,...

33213
来自专栏技术博客

aehyok.com的成长之路二——技术选型

  在上一篇博客中http://www.cnblogs.com/aehyok/p/3934197.html主要简单的介绍了自己做个人网站的初衷,就是为了督促自己...

672
来自专栏Rainbond开源「容器云平台」

搬运向 | 浅析serverless架构与实践

2375
来自专栏极客编程

8个写完以后就可以让你成为顶尖开发者的有趣应用程序

只有不断的努力才能成为伟大的开发人员。想象一下 ——你不能通过阅读大量关于健身,成为一个身体健康的人。你实际上需要去健身房,把时间和汗水放进去!同样的概念也适...

781
来自专栏杨建荣的学习笔记

自动化平台开发的几点总结

最近花了些时间在琢磨自动化平台开发的事情,所以每天都会抽出几个小时来写一写,大方向的开发任务算是逐步有了眉目。如果客观来说,这部分的工作算是完成了20%左右。前...

3428
来自专栏企鹅号快讯

想知道你的对象用微信和谁聊得最多吗?一个代码告诉你

在生活中、工作中经常使用微信与好友聊天,有时候聊天的消息多到自己都不知道有多少,有用户就很好奇,这该怎么查看与好友的聊天记录数量呢? ? 今天告诉大家一个方法,...

21810
来自专栏C语言及其他语言

重新敲一遍代码,胜过拷贝粘贴

来源:腊八粥 网址:http://www.labazhou.net/2015/10/dont-copy-paste-retype/ ---- 原文地址(ori...

2955
来自专栏新智元

网易有道CEO周枫:Go语言继承了C语言的灵活简单

来源:周枫 转载编辑:常佩琦 【新智元导读】网易有道CEO周枫推荐Go语言。他认为Go很好地继承了C语言灵活、简单有效的思想;Go有很高的生产效率;Go精选了一...

35012
来自专栏阮一峰的网络日志

几种计算机语言的评价(修订版)

编程新手都有一个同样的问题:"我应该学习哪一种语言?"。 《Unix编程艺术》(Eric Raymond著)第十四章,对各种语言进行了评价,正好可以用来回答这个...

3898

扫码关注云+社区