项目说明
OurEDA实验室每年都会面向大一新生招人，每周的沙龙都会有学长来讲课，传经验，录下来的沙龙视频就非常有价值，因此，在老师的安排下，我负责开发了慕课网这样一个项目。
首要问题及其解决方案
视频网站首先需要考虑的问题就是大视频文件的播放，上传，处理。
- 沙龙一般时长为一个半小时，所以项目至少要能承受4GB的大小的视频文件的上传。这里我选用了百度的fex-webuploader，利用其分片上传功能，先分片上传，再后台合并，利用事务机制实现空间的最大化利用，防止“死文件碎片”的产生。
- 视频的播放我使用了JWplayer的播放器，后台使用nginx做静态文件代理，对非文件请求使用nginx反向代理。
解决了视频文件问题，剩下的就是web开发的基础问题了。
技术选择
随着项目经验的增加，我对于一个较大项目的的前后端分离非常看重，因为这涉及到项目中后期的效率问题，非常重要。
- 前端工程使用React+Webpack+Redux，因为后台管理涉及很多增删改查的步骤，使用Redux是非常有必要的。在前后端分离方面，我利用Node做了一层中间层，使用自己编写的proxy中间件，将带有特定前缀的请求都重定向到开发者指定的地方，中间的处理过程对开发者来说是透明的，这样就解决了安全跨域的问题。
- 后端工程一如使用Koa等熟练的技术进行的开发。
- 架构使用前后端分离，在自动化方面增加了gulp来协助webpack进行自动化转译等工作。
前端工程结构
IMooc/
├── mocks/ 假数据，用于开发
├── assets/
│ ├──html/ 编译压缩后的html文件
│ ├── dist/ 静态资源文件
│ ├── font/
│ ├── js/
│ ├── css/
├── src/ 源码目录
│ ├── html/ ect模板
│ ├── css/
│ ├── js/
│ ├── scss/
│ ├── image/
│ ├── lib/ bower目录
├── server/ 源码目录
│ ├── instances/ 实例
│ ├── lib/ 库函数
│ ├── routes/ 路由
│ ├── views/ 网页渲染内容
│ ├── public/ 公共资源文件上面server是一个小型服务器，不处理复杂路由逻辑，只具有转发的作用，充当中间层，mocks假数据用于前后端平行开发，前端的所有开发都在src内。
一些收获
- redux的思想很惊艳，层次的划分非常具有美感。
- react的组件复用特点用好了，越到后期开发速度越快，用“信手拈来”形容再恰当不过。但是要注意组件的设计一定一定要有规划，要知道会有多少页面用到所需的组件，越原始的组件改动接口结构越危险，
- 前后端分离真的很棒，即使是一个人对功能进行修改，也能做到条理清晰。
- gulp+webpack自动化一定要做，会非常省心，开发者启动了自动程序后只需要关注代码即可，刷新浏览器，热加载一类的活就应该交给工具干！
项目部分页面截图
