旁白：遥远的外太空，一个代号为js的星球暴露了它的坐标，程序员星球派出了三位美女程序员，去这个神秘的星球考察。
特效：飞船
演员出场，摆pose
旁白： 然后飞船在登陆过程中被层层阻挠，经过破译信号，三位美女程序员发现，她们需要回答对方提出的问题，才能登星球。
js： 开发一个网页，用来展示服务端数据，用户可以对数据进行筛选，使用什么技术
a： 当然是用react
js： 什么是react
b： react是用来展示数据的库，它可以使代码维护性更高。使用react很简单，只需要引入react和react dom这两个依赖，然后用babel编译一下就可以了。
js： 什么是babel
c： Babel 是一个转译工具，Babel 能把你写的 JS 转译成任意版本的 JS。babel也可以用来编译es6
js： es6是什么
a: es6是javascript的一个版本，因为绝大部分浏览器都支持es5，所以需要把es6编译成es5，现在没人直接用es5了，都是用6,或7，就像iphone一样。
js：所以我只需要引入依赖的库，把代码用babel编译，就可以了？
b: 其实你可以用「模块管理器」把这三个库「打包」成一个文件。
js: 什么是模块管理器
c: 一般指的是管理amd或cmd模块的东西
js：什么是amd，cmd
a: 两种定义，用来描述模块的交互方式，你可以按amd或cmd的api来写代码，然后用browserify打包
js：什么是browserify
b: 是一个将commonjs形式的js文件打包起来的工具。npm上的模块都是commonjs形式的
js：什么是npm
c: 是一个公开的仓库，用于放置可依赖的模块。
js：所以我用 npm 安装 React 然后用 Browerify 来打包就好了？
a: 是的，你应该使用 Grunt、Gulp 或者 Broccoli 这样的任务管理工具，它们能自动运行 Browserify。
js：又是什么
b: 任务管理工具。不过我们现在已经不用了，现在我们用的都是 Webpack。
js： Webpack 是什么？
c: 另一种模块管理工具，同时也是一个任务管理工具。你可以认为它是 Browserify 的加强版。。Webpack 告诉你应该如何管理你的依赖，Webpack 允许你使用不同的模块管理器，不只是 CommonJS，甚至支持 ES6 模块。
js：回到 React 吧，用 React 我怎么从服务器获取数据？
a:额，React 没有提供这个功能，你只能用 React 展示数据。
js：服了啊。那我怎么获取数据？
b:你用 Fetch API 就可以了。
js：啥玩意？这个 API 的名字很烂啊。
c:我也觉得是啊。Fetch API 是浏览器提供的异步请求接口。
js：哦，那不就是 AJAX。
a:AJAX 只是使用 XMLHttpRequest 对象，但是 Fetch API 可以让你用 Promise 风格来发起异步请求，帮你摆脱「回调地狱」。
js：天呐我到底需要多少个库？
b:这是 JS，同一件事情有上千个库在做。我们了解库，而且我们有最好的库，我们有海量的库，要什么有什么。
js：好吧，有了这些，我终于可以获取数据然后用 React 展示数据了，对吧？
c:你的网页需要处理状态变更吗？
js：唔，不用吧。我只是想展示数据。
a: 那就好，不然我就得跟你解释 Flux，以及 Flux 的一些实现，比如 Flummox、Alt、Fluxible。不过说真的你应该用 Redux。
js： 吐血，这么多知识，你们是怎么知道的。
abc：我们都在程序员星球的alloyteam学院进修！
js： 我也想去
特效。飞船着陆，两个星球建交。
网友评论