现在的前端

@前端小武

北京 百度 网页搜索部

#用户体验 #前端架构 #前端规范

什么是前端?

  • div+css?
  • 切个图: psd->html
  • 套个模板:dedecms、帝国cms
  • 网页特效

现在变了?

其实现在快速迭代的市面和人才济济,只会这些已经不行了

规范

  1. 与设计师制定基础样式规范、交互规范
  2. 与后端开发制定接口规范、数据规范
  3. 约定好前端代码规范、目录规范

把约定好的规范列入文档

样式、交互规范

  • 定义基础样式:栅格、颜色、间距、字号等
  • 定义组件:幻灯、Tab、筛选、手风琴、输入框、下拉框等
  • 数据加载:加载中、加载超时、加载出错、数据为空

接口规范、数据规范

  • 接口参数类型和值
  • 返回值结构和类型(强制类型)
  • 接口路径(版本、语义化)
  • 数据容错的处理

参数说明

前端规范

  • 目录结构规范
  • 与后端联调的规范(接口依赖、数据质量依赖)
  • 代码风格规范(eslint、csshint、fecs)
  • 代码模式:命名空间、amd、cmd、commonjs
  • 代码部署

用户体验

  1. 什么是用户体验?
  2. 前端应该考虑吗?
  3. 如何做到?

测试

  1. 测试不是 QA 的工作吗?
  2. 为什么需要测试?
  3. 测试的好处

这些就够了?

多元化

  1. 常用的:shell、正则
  2. webserver:nginx、Apache、nodejs
  3. 多平台:windows、linux、osx
  4. 版本控制:git、svn
  5. 测试:测试用例、代码覆盖率、持续集成
  6. 工程化脚手架:gulp、webpack、fis(重要的是理解概念)
  7. 其他语言:php、python、java

Q & A

谢谢