# SPA 富应用开发
## 课程资料
- [课程大纲](http://naotu.baidu.com/file/529af44e87eb1ed5566b54b2f23771c0)
- [幻灯片](spa.pptx)
- [通关任务](http://spa.wangding.co)
## 课程视频
- [课程视频](http://spa.wangding.co/chapters/video.html)
## 示例代码
- [在线矩形计算器](https://wangding.github.io/rectangle/)，仓库地址：[wangding/rectangle](https://github.com/wangding/rectangle)。在线矩形计算器是 SPA 课程的第一个大作业，覆盖了课程的前半部分内容。用户输入矩形的长度和宽度，程序计算出矩形的面积和周长。应用程序的开发涉及到自动化构建的静态代码检查、单元测试和性能优化，以及数据合法性校验等技术。
- [wangding/grunt-demo](https://github.com/wangding/grunt-demo) 仓库，演示 Grunt 各种自动化构建任务，包括：预编译、单元测试、静态代码检查和性能优化，等。
- [SPA 课程示例](http://fe.wangding.co/)，仓库地址：[wangding/spa-demo](https://github.com/wangding/spa-demo)。课程示例包含课上所有小的 Demo 示例代码，整个网站是个单页应用，使用了自动化构建技术。
- [在线记事本](http://np.wangding.co/)，仓库地址：[wangding/jsnotepad](https://github.com/wangding/jsnotepad)。这个综合案例覆盖课程后半部分内容，实践 UI 组件化开发思想。包含五个对话框 UI 组件的封装，一个列表控件的封装以及三个主界面组件（菜单栏、编辑器和状态栏）的封装。并实现自动化构建。
- [匠人牛品管理后台](http://admin.wangding.co/)，仓库地址：[wangding/admin](https://github.com/wangding/admin)。这个综合案例覆盖课程后半部分内容，实践 UI 组件化开发思想。包含登录组件、页头、最侧导航、页脚、以及中间控制面板 UI 组件的封装。左侧导航使用前端路由机制调取相应的功能面板。使用了自动化构建技术。
