已经有一个多月没更新博客，因为最近实在太忙，没额外的时间去整理和总结，后续会一步一步弄上去的。
前面两章分别介绍了Vue，本章就直接从代码入手开始讲解Vue。
本章东西讲解会特别多，因此先给大家介绍下使用到的东西：
- git ：获取github上面的开源项目及Demo
- node.js ：使用npm获取安装需要的框架及插件
- webpack ：搭建前端工程化的框架
- vue ：轻巧的MVVM框架
- vue-loader ：组合webpack与vue，方便解析*.vue格式的web组件化文件
- vue-router ：实现SPA单页应用所用到的路由
- vuex： 共享全局vue实例变量
- fastclick ：消除移动端点击时出现的300ms延迟，使用户点击更爽，解决点透问题
- zepto ：需要用到其DOM操作及Ajax
- animate.css ：CSS3动画实现页面与页面之间的跳转
- http-server ：静态访问本地资源
- CommonJS规范 ：进行模块化的代码编写
- ES6规范：JavaScript的规范父级
1.准备工作
既然要使用Vue实现数据绑定和组件化，就需要编写*.vue后缀的文件，因此需要使用Sublime的高亮显示和自动提示功能来让前端开发更加舒适，因此需要安装Vue.js所对应的插件。
当我安装完后，用Sublime打开*.vue后缀的文件还是无法高亮，问题是：
因此，当我把SASS、CoffeeScript所对应的高亮插件也安装后，终于变颜色了。
2.搭建架构环境
该架构的成功搭建不是一时半会就能讲解清楚的，因为东西实在太多，vue+vue-loader+webpack+vue-router+vuex的搭建，fastclick+zepto+animate的使用，它们之间是如何组合在一起的，后续有时间会补充，因为是实战Vue，所以着重点会放在Vue，搭建完成的架构目录如下：
具体说明，请看：
3.语法讲解
3.1 Vue 与 JQuery
在语法讲解之前，我想先说下自己使用vue的感受。 Vue的学习成本稍大，因为，引用以前学的文章《初识Vue.js》的最后一句话：
现阶段前端人员最大的问题不是技术实现，而是思维转变。
所以在思维转变的过程是很需要时间的。 以前前端根深蒂固的思想就是使用过JQuery、Zepto等框架造成的，当年JQuery和Zepto的出现，是因为当年浏览器性能不够强大，为了解决各浏览器之间的兼容性，为了解决简化DOM操作等问题。 可如今浏览器性能已经变得非常强大，及使用IE浏览器的用户也越来越少，因此上面的问题已得到很好的解决。 以前的前端框架被硬件所制约，不得不为了硬件而妥协了业务。 而如今浏览器已强大到原生Native研发可以自己创建和销毁浏览器（webview），如QQ、淘宝、微信 App等。
JQuery、Zepto的核心思想是封装DOM操作，它们认为一切的的操作都是从查找元素开始的，这个封装只是代码层面的封装。 比如：
scene1.我要获取该页面的某个元素或多个元素时，步骤是：
1.为这个元素定义唯一标示符
<div>1</div>
<ul>
<li id='first' class='selected'>列表一</li>
<li>列表二</li>
<li class='selected'>列表三</li>
</ul>
<div>2</div>2.根据这个唯一标示符从该页面找元素
var first=document.getElementById('first')
var selected=document.getElementsByClassName('selected')
//JQuery写法，写法是不是简单多了
var first=$('#first')
var selected=$('.selected')scene2.我要点击个按钮，同时隐藏两张图片 1.先定义两张图片和一个按钮
<div>
<img src='xxx'></img>
<img src='xxx'></img>
</div>
<button id='btn'>隐藏按钮</button>2.给按钮添加点击事件，使其两张图片隐藏
var btn=document.getElementById('btn')
btn.addEventListener('click',function(){
var imgs=document.getElementsByTagName('img')
for(var i in imgs){
imgs[i].style.display='none';
}
})
//JQuery写法，写法是不是简单多了
$('#btn').on('click',function(){
$('img').hide();
})下面来说Vue、Angular， Vue、Angular的核心思想是根据业务封装数据展示页面，它们认为一切的的操作都是从数据开始的，这个封装是业务层面的封装。 先写到这，待续。。。
