Vue介绍

前端发展史按理说不能这样粗粗略的一带而过，发展史如果想写的话内容还是蛮多。但是咱的重点毕竟不在这块儿，有个基本了解即可。总之，大致经过了以下几个发展关键转折点。当然最后也添加了个人猜测。目前还没有不能代表不出现，有个预见未来的大胆想法也是很不错的哟。要用于预测未来才有机会创新嘛！

HTML、CSS、JavaScript

Ajax太发送异步请求

angular框架出现

React、Vue框架

移动开发Android、IOS、web

一套代码在各个平台上运行

在不久的未来可能会出现统一天下

1.Vue是什么？

Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。

如果你想在深入学习 Vue 之前对它有更多了解，我们制作了一个视频，带您了解其核心概念和一个示例工程。

如果你已经是有经验的前端开发者，想知道 Vue 与其它库/框架有哪些区别，请查看对比其它框架。

2.M-V-VM 架构思想

M 数据层(model) js

V 视图层(view) HTML、CSS

VM 数据层和视图层之间的一层(model view)

# 扩展以下VM吧！
VM是数据层和视图层之间的一层，不需要手动进行DOM操作了
作用：以后页面变、js变量就变；js变量变、页面就变

3.组件化开发、单页面应用

组件化开发：以后都是写一个个组件，组件的组合成页面

单页面应用：spa(single page application)，一个个的HTML页面

4.版本问题

1.X：使用的已经比较少了

2.X：目前使用频率最广的

3.X：公司新项目会选择的

# 关于版本问题
首先1.X版本几乎不怎么用了，除非是老项目需要维护；
目前使用频率最广泛的2.X版本最后就是3.X版本出了很久了，
一些公司的新项目会选择使用；
3.X的语法有些差距的，
但是Vue3完全兼容Vue2，说明Vue3上可以写Vue2，但是官方不建议这么用。

1.了解开发前端的编辑器

my eclipse(eclipse)

idea(Java)

pycharm(Python)

goland(go)

phpstorm(php)

vscode开发

vim开发

subline text

Androidstadio

介绍了那么多编辑器，但是我们学习基于Vue2，用pycharm与Vue插件配合的模式学习。搞笑吧哈哈哈，纯粹是未来提高学习效率！

2.通过Vue打印出helloworld来演示初步使用规范

第一步：打开pycharm创建pure Python 项目

第二步：项目根目录下创建js目录，在js目录下建js文件，粘贴Vue原密码

第三步：在根目录创建一个HTML文件

第四步：在此文件写如下代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/vue.js"></script>  <!--第一步引入Vue源码-->
</head>
<body>
<!--第二步在body内写div标签，其实什么标签都可以-->
<div id="app">

    {{name}}

</div>

</body>

<script>
    // 配置项 key value的形式
    var vm = new Vue({
        el: '#app', //vue管理了这个div 以后在 div中可以写Vue的语法了
        data: {
            name: 'hello world',
            age: 19
        }
    })
</script>

</html>

最后展示以下效果吧！！