了解vue，脚手架、组件化开发

1、Vue

• 基于 JS 的前端框架
• 基于MVVM 架构模式实现了数据自动双向绑定，从而替代了DOM 操作
• 提到架构模式 就必须提一下 观察者模式 / 发布-订阅模式
• 推荐组件化开发
• 脚本形式-不是很规范，工程化 CLI-比较规范

框架：繁琐操作自动化，通用流程规范化

2、组件

• 预定义的、可复用的功能单元
• HTML 自定义标签，基于虚拟 DOM实现的
• 自定义颗粒度

Bootstrap 是一个前端组件库，HTML & CSS
Vue 组件：模板、脚本、样式

3、Vue CLI - Command Line Interface / GUI

• Vue 脚手架 / 组件化 开发
  开发流程：

// 创建工程方式一
vue create myapp
// 创建工程方式二
vue ui

// 进入工程目录
cd myapp

// 启动工程
npm run serve

// 构建、打包工程
npm run build

// 其他（安装依赖或插件）
npm add vuex
vue add vuex/router/element/...

// 安装 node_modules 模块，再启动
npm install

4、组件和组件之间的通信

传统：父组件通过props向子组件传递数据，子组件通过$emit向父组件传递数据

5、集中式状态管理 - Vuex

现代：state、getters、mutations、actions、modules

6、单页面程序（SPA）中的路由 - Vue Router

什么是路由？

视图（多个组件【view】） / 资源（数据【data】） 与 URI形成的一组映射

1. vue add router
2. new Router()
3. 定义一组路由规则 routes
{
	path: '/foo/:id',
	component: Foo
}
4. router-link / router-view
5. 

7、vuetools

8、介绍 SSR - 服务端渲染

优势

与传统 SPA (单页应用程序 (Single-Page Application)) 相比，服务器端渲染 (SSR) 的优势主要在于：

• 更好的 SEO
  由于搜索引擎爬虫抓取工具可以直接查看完全渲染的页面。
• 更快的内容到达时间(time-to-content)
  特别是对于缓慢的网络情况或运行缓慢的设备。

权衡之处

使用服务器端渲染 (SSR) 时还需要有一些权衡之处：

• 开发条件所限。
  浏览器特定的代码，只能在某些生命周期钩子函数 (lifecycle hook) 中使用；
  一些外部扩展库 (external library) 可能需要特殊处理，才能在服务器渲染应用程序中运行。

• 涉及构建设置和部署的更多要求。
  与可以部署在任何静态文件服务器上的完全静态单页面应用程序 (SPA) 不同，服务器渲染应用程序，需要处于 Node.js server 运行环境。

• 更多的服务器端负载。
  在 Node.js 中渲染完整的应用程序，显然会比仅仅提供静态文件的 server 更加大量占用 CPU 资源 (CPU-intensive - CPU 密集)，因此如果你预料在高流量环境 (high traffic) 下使用，请准备相应的服务器负载，并明智地采用缓存策略。