发表于: 2017-06-06 23:51:57
1 1342
今天完成的事情:
完成了找职位所有页面
明天计划的事情:
整合项目
遇到的问题:
公司在招职位页的类别搜索,story上写了要做这功能,但是官网没有,而且我想做没头绪,因为没有公司有很多职业让我测试的,所以测接口都测不了
收获:
一开始没有配合好的话,整合的时候很难受,一些公共服务的名字不一样,改名字就改了很久
下面是前端项目搭建比较好的建议
首先,我觉得规划css的有个影响因素,就是网站的设计思路,如果网站是有一个整个的设计风格的话,规划的时候可以将模块的粒度适度放大。
结构拆分
- 基础框架:包含重置样式、栅格、css3动画模块,还是可以加上矢量图标库(iconfont)、辅助类
- 通用样式库: 基本的复用模块,如button、form、table等,这个设计的时候要注意复用性和维护性
- 业务样式:包含网站各页面之间的网站特有的样式,如导航、列表页、评论等
- 解决方案: 可以归纳一下常用的css问题,如兼容多浏览器的高度不固定的垂直水平居中、png透明图片支持等。。
代码规范
- 命名空间+模块化+语义命名,可以参考Amaze UI HTML/CSS 规范
- 兼容性列表:这个视业务需求而定了,如果逼格高一点,如ie8+基本和hack说再见了
- javascript组件:复杂的交互组件都是和javascript配合,建议公司内部有统一的规范,如果没有,可以参考业内的bootstrap、aralejs都可以
开发工具
现在通过预处理器开发样式很常见了吧,如果是node,就用stylus或者less,像est的样式工具库应该可以帮你提高效率哈
文档
文档不多说了,对于团队的维护性不言而喻,推荐一个专门用于css自动化文档工具 -- Hologram,不过依赖于ruby
业界参考
Semantic UI
顾名思义,语义化的css库,组件的划分我觉得可以参考一下哈
Amaze UI
中国首个开源 HTML5 跨屏前端框架,采用less编写,移动优先,文档很详细,建议仔细阅读,收获不少
bootstrap什么的就不用说了
评论