前端工作思路及技巧

一．项目准备

1.以产品原型为基准对项目进行评审，对项目进行分析、思考，提出问题进行沟通

2.以设计图为基准进行评审，对设计图颜色、布局、交互效果进行讨论沟通

3.根据项目周期制定合理的开发任务，以天为单位

4.根据项目与团队沟通，选择运用的框架及技术进行部署

二．项目开发

1.搭建项目生成项目结构

2.新建页面/模块，创建页面/模块所需的资源，并引入。

3.创建文件夹，包含项目公共css, js, img

4.根据设计图进行项目开发：

1）开发：严格按照需求文档和设计图完成功能的开发。

2）联调：在与后台同学联调前，对照测试用例，对自己的模块进行了严格的自测。

3）提测：提测前，是否已自测、联调通过；测试正式介入前，产品是否提前部署到测试环境，并进行初步的验证。

三. 开发技巧

1.用好工具

用好工具能可以

减少一些重复劳动，如Compass可以自动生成图片精灵

减少做一件事情的路径。如cutterman是一款运行在photoshop中的插件，能够自动将你需要的图层进行输出，替代使用切片工具进行挨个切图的流程，从而提高我们的工作效率。

2.编辑器

1)语法高亮

2)括号匹配

3)能快速定位

快速打开文件

在文件中查找

在文件夹中查找

跳至某一行

4)能安装插件

3.熟练运用浏览器进行调试

1）审查元素

2）打断点和条件断点

3）改变元素的状态例如:hover focus

4）熟练使用浏览器的控制台

5）移动端调试：用pc浏览器模拟手机浏览器；

4.做好时间管理

1）做好计划，在自己效率高的时候，做一些难的事情；效率低的时候，做一些简单的事情

2）工作时专注，细心