针对在实验室做的项目的前端部分,通过以下问题可以进行自查和面试准备:
翻译自https://github.com/bradfrost/frontend-guidelines-questionnaire
HTML
HTML原则
- 你的团队在写HTML的时候有什么规范吗? ×
例如,语义化?
参考规范
HTML工具
- 使用HTML预处理工具了吗?×
例如, HAML, Jade…… - 使用模板引擎了吗?×
例如,Mustache, Handlebars……
HTML样式
- 空格还是Tab?×
- 注释应该写成什么样? ×
CSS
CSS原则
- 你的团队在写CSS的时候有什么规范吗?×
例如,模块化、避免长选择器字符串……
参考规范
CSS工具
使用预处理器了吗?
√,使用了Sass使用CSS基本样式了吗?
例如,Normalize或reset?
√,使用了Bootstrap内置的使用后处理器了吗?
例如, Prefixfree or Autoprefixer
√,在gulp构建过程中使用了autoprefixer有使用特定的CSS技术吗?×
例如, critical CSS
CSS框架
团队使用了什么框架?
√,使用了Bootstrap对框架做了什么改动吗?
√,基于框架自己编写了一些组件和页面模版
CSS样式
- 空格或Tab?×
- 间隔规则?
√,一般都是组件自带的间隔 - 分组属性?
- CSS注释应该是什么样式?
JavaScript
js原则
- 你的团队在写JS的时候有什么规范吗?×
airbnb js规范
js工具
使用js框架了吗?
√ jQuery使用什么polyfills了吗?×
使用了第三方的脚本吗?
√ hichart测试js吗?×
例如,Jasmine、Karma……
JS样式
- 空格或tabs?
- JS注释应该是什么样式?
- 遵循什么设计模式?
媒体
使用图标了吗?
√ 使用Bootstrap自带的glyphicon,同时加入了一两个特殊图标怎么处理响应式图片?×
例如,使用srcset & < picture />使用什么工具来优化图片了吗?×
性能
测量过项目的速度吗?×
例如,https://developers.google.com/speed/pagespeed/ 或
http://tools.pingdom.com/用了什么技术来减小文件数量? ×
例如,https://css-tricks.com/snippets/htaccess/active-gzip-compression/ 或
https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/image-optimization在工作流中用了什么性能相关的工具吗? ×
例如 http://www.webpagetest.org/ 或 https://speedcurve.com/ 或
https://aerotwist.com/blog/bigrig/
可用性
有遵循可用性建议吗?×
http://a11yproject.com/checklist.html在工具流中用了什么可用性相关的工具吗?
http://a11yproject.com/resources.html
工具
使用任务管理工具了吗?
√ 在前端框架中使用了gulp使用依赖管理了吗?×
例如,bower或composer使用脚手架工具了吗?×
例如,yeoman使用任何用来增强前端样式的工具了吗?×
例如 csslint
版本控制
使用什么版本控制系统?
√ svn使用了版本控制工作流吗? ×
例如 gitflow, centralized, feature-branch谁来负责对版本控制代码进行管理?
负责人?