vivaxy

上期，我们实现了 Bird, StickManager 模块，这期我们将实现 Input，碰撞检测和完成整个游戏。 运行下可以看到点击后，Bird 向上飞了。 分两部分：鸟和边界的碰撞，鸟和柱子的碰撞。 我们把 Bird 抽象成椭圆，把 Stick 抽象成矩形。 上图黑色表示碰…

上期，我们实现了 canvas, Background 模块，这期我们将实现 Bird 和 StickManager 模块。 Bird 也是一个可移动的模块，但是和之前的 Background 的移动模式不同，Bird 的移动是有加速度的。 边界碰撞。碰到顶部和底部，游戏结束。…

上期，我们介绍了 canvas, GameManager 模块，这期我们实现一下上次拆分的 canvas 和 Background 模块。 由于画布在全局是单一的，所以在实现 canvas 模块时，我们采用单例模式。 为了让 canvas 占满整个屏幕，我们需要设置一些 css…

我打算用几期的时间做一个 Flappy Bird 游戏。 H5 游戏有不少现成的引擎，可以让开发这很方便的完成游戏开发。比如： 然而今天我不用这些引擎。使用原生 js 实现这个游戏。 新项目中默认包含了 es6, webpack 等特性帮助我们开发。 修改 src/entrie…

按照 移动端全兼容的flexbox速成班 一文给出的 flex 布局方案下，为了兼容旧版 box flex，会强行指定 height: 0。 如果其中的自元素采用了 height: 100% 的话，在 safari 中则引起了高度为 0 的问题。然而在 Chrome 下则无此问…

在使用 Node.js 实现 FTP 文件上传的过程中，我发现文本文件可以正常上传，但是图片文件则不行。图片被上传后，文件内容被更改了，无法正常打开了，文件大小也不一致了。 使用的是 jsftp 包。参考了 ftp-deploy 包。 在尝试后发现问题是由上传模式导致的，上传非…

async 的 eachSeries 方法实现了多个异步方法的顺序调用，一次只执行一个异步方法。 I don't need async.

webpack dev server 是 webpack 提供的用于本地开发的工具，它支持代码热更新，能迅速将更改后的代码更新到浏览器中。在这个模式下，构建后的代码在内存中，不会写入硬盘，所以读写速度快了很多。 或者在命令行执行 NODE_ENV=development ./n…

webpack 通过 plugins 实现各种功能。常见的 plugins 如下： 这个插件可以把命令行的环境变量带到浏览器端。react 认为 NODE_ENV=production 是生产环境，类似的我们可以定义不同环境的 NODE_ENV，在浏览器代码中通过 proces…