实战组件开发——手机日历 - 3. UI 开发与策略模式

这是《实战组件开发——手机日历》系列讲堂的第三讲。继续讲解如何开发面向移动网页的日历选择控件，这次重点是 UI 开发和设计模式。

上节课我们使用测试驱动开发的方式，根据需求，先确定要使用的方法，写出对应的测试，才完成方法使其通过测试，完成了日期逻辑的开发。这一讲，我会结合第一讲完成的界面，输出完整的 UI；同时，由于需求方要求两个不同的使用方式，所以，我还会用“设计模式：策略模式”来处理。

上次我们只写了一个模块，在 Node.js 下测试，不涉及打包的问题。这次我们需要使用 Webpack 将所有代码打包到一起进行发布，自然需要补充一些相关知识，包括原理、组成、配置等等。

设计模式也是大家绕不过的一道墙。在 ES6 的帮助之下，设计模式可以更好的应用在 JavaScript 开发之中。这里会简单介绍一下设计模式的由来，让大家了解到为什么要用设计模式，什么场合下该考虑用设计模式。不过这个项目中没有太多复杂的东西，所以只是根据需要选用“策略模式”。

本节课计划讲授：

1. Webpack + Babel 搭建开发环境
2. 设计模式：策略模式
3. 使用策略模式进行可复用的开发

面向受众：

1. 希望学习 ES6 开发
2. 了解 JavaScript，有编程基础
3. 希望学习设计模式

本系列目录

1. 实战组件开发——手机日历 - 1. 项目启动
2. 实战组件开发——手机日历 - 2. ES6 与测试