仿B站项目——(1)计划，前端工程
计划
现打算：
- 计划用webpack打包 + 模板语言 + jquery + jquery ui + bootstrap做一个仿B站的静态网站。
- 网站兼容手机浏览器端。
- 部分模块打算仿照SPA用js加载的方式实现。
- 数据结构要有方便配置的形式。(便于网站更新)
- 网站优化，目前打算用图片懒加载等方法。
- 最终结果要与B站90%相同，包括动画，互动等，不包括用户登录，视屏播放等(因为要服务器支持)。
后续打算：
- 网站用vue重构。
- 把网站做成一个webapp。
- 添加服务端。
前端工程
参考前端工程说明的方法来用工程方法构建项目。
项目目的与需求
- 熟悉前端工程化流程。
- 沿路学习前端工程化所需要的知识。
技术选型
html模板引擎
如果项目使用到 React/Vue/Angular 其中一个，则完全不需要HTML模板引擎。否则可以选择 ejs pug(jade) handlebars 等模板引擎。
个人考虑：我打算先学习一下模板引擎，所以先不用React/Vue/Angular，等之后熟悉了模板引擎之后再重构。我选择ejs模板引擎，原因是它很小巧，我也只需要它来向html中填充数据而已。
css预处理
主流的有 less sass stylus
由于sass(scss)用的人更多，而且腾讯Alloy团队代码规范用的scss，所以我打算用scss。
css框架
毫无疑问用Bootstrap，我也想深入学习一下Bootstrap。
js框架
由于先不使用React/Vue/Angular，我选择使用jQuery。
es6和js超集
用es6是肯定的了。先不打算用js超集，因为用的人还很少，不是太稳定。
兼容性
并不打算兼容ie8及以下，也不打算兼容低版本浏览器。
流程规范
规范选择
- 除了缩进，其它使用腾讯Alloy团队的代码规范。(我的js缩进是2个空格)
- 使用基于树结构的CSS命名规范。
- 使用normalize.css而不是reset.css。
- 使用nec的命名规则
实际情况制定规范
(1)所有m/文件夹下的css都要以.m-作为前缀。这样看到一个class如果是.m-box则直接去找m/box/index.css，看到.some则直接找HTML同级目录的css文件。
(2)约定完全不要使用ID选择器，class 选择器使用 .m-box-hd-title {} 这种结构命名法降低权重。保持大部分选择器权重都是 0, 0, 1, 0。
(3)有时删除了一个 class ，JS 绑定的事件就失效了，则可以将所有用于 JS 选择的 class 都以 .js- 作为前缀。例如： .js-submit .js-list-remove。
