一、REACT概述

1.前端/react概述 《从零react》

1.前端工 程概述

 Web跨平台、跨浏览 器的应用开发场景

  网页浏览器（Web Browser）

  通过 CLI 指令去操作的 Headless 浏览器（Headless　Application）

   如：phantomJS、CasperJS 等

  运作在 WebView 浏览器核心 （WebView Application）的应用

   如：Apache Cordova、Electron、NW.js 等行动、桌面应用程序开发

  原生应用程序（Native Application） 通过 Web 技术撰写原生应用程序

   如：React Native、Native Script 等

 前端技 术包括

  基础：HTML、CSS、JavaScript

  Js框架和函数库： Backbone、Ember、Angular、React、Vue

 革新性 Web观念

  Virtual DOM

  Web Component

  更直觉的定义式 UI 设计

  更优雅地实现 Server Rendering

 学习目标

  从零开始真的动手用 React 开发跨平台应用程序

2.React 生态

 定义

  React 是专注于 UI（View）的 Js 函数库（Library）

 React 生态系（ecosystem） 体现的现代化 Web 开发观念

  模块化

  ES6+

  Webpack

  Babel

  ESLint

  函数式程序设计等

 ReactJS

   MVC 框架来看，定位是View的范畴

  ReactJS 0.14 版之后，把处理DOM部分独立出去（react-dom）

 JSX

  JSX是一种语法糖（Syntatic Sugar）

  类似 XML 的 ECMAScript 语法扩充

  在 JSX 中 HTML 和组建这些元素标签的程序码有紧密的关系，这和过去我们强调 HTML、Js 分离的观念大不相同

  可不用，但建议用，在编写React 元件（Component）时有巨大优势

 NPM

  即，Node Package Manager，是 Node.js 下的主流包管理工具

  其上有非常多包，可不用重复造轮子，更可轻松用指令管理不同包

  基于 CommonJS 的规范，通常必须搭配 Browserify 这样的工具才能在前端使用 NPM 的模块

  NPM 基于嵌套依赖关系（Nested Dependency Tree），不同的包有可能会在引入依赖时会引入相同但不同版本的包，造成档案大小过大的情形

  另一个包管理工具 Bower 专注在前端包且使用 Flat Dependency Tree（让使用者决定相依的包版本）

 ES6+

  ES6+ 系指 ES6（ES2015）和 ES7 的联集，在 ES6+ 新的标准当中引入许多新的特性和功能，弥补了过去 Js 被诟病的一些特性

  直接学习 ES6+ 用法是相对好的选择

 Babel

  通过 Babel 这个 Js 编译器（可想成翻译机）可以让你的 ES6+ 、JSX 等程序码转换成 [部分不支持的浏览器] 可以看的懂得语法

  通常会在数据夹的 root 位置加入 .babelrc 进行转译规则 preset 和引用外挂（plugin）的设定

 Js模块 化开发

  CDN-Based

   即传统的