【前端个人工作复盘总结】2021-10-18

目前手头上的项目基本交付完成，趁着记忆还是热腾腾的，利用空余时间，复盘一下近期的工作，把重要的经验教训梳理沉淀下来，在此记之以提醒和勉励自己。

一、复盘的底层逻辑：

根据“GRAI复盘法”（Goal（目标回顾）、Result（结果陈述）、Analysis（过程分析）、Insight（归类总结））来进行整体梳理。

二、项目复盘的阶段流程：（开发前、开发中、开发后）

1、 项目开发前

项目开发前，首页要做的就是：需求分析。

①跟设计同事、后端同事开会沟通，了解项目的整体结构以及需求。（很多细节一定要考虑全面，比如基础的交互效果：输入框清空后，数据如何展示等等）

②了解需求后，要有项目敏感度，准确的捕捉并罗列出前端技术方面的重难点，针对相关的问题一一找到应对方案。（比如某个技术难点或者没有接触过的效果如何实现的问题。这也是后续工作中需要积累和加强的一方面。）

③针对项目结构中的矛盾点或者疑问点，及时与项目相关同事进行沟通，达成一致。

④充分准备好 自身对于该项目中需用到的知识和技能。（这就要在平时的项目中，遇到问题及时总结，以便之后遇到同类问题可以得心应手的处理。）

2、开发过程中

①先搭建出整体的项目架构，善用一些前端的 UI 框架，例如：Bootstrap、Element UI、JQuery UI 等。（代码结构清晰，选择并引入该项目要用到的框架或者插件）

②选择自己擅长的编辑器，了解并熟知编辑器自带的功能码快捷键（如搜索功能、整合代码），提高开发效率。（比如我的个人习惯：写网站和公众号喜欢用HBuilder，写小程序和APP喜欢用HBuilderX或者VsCode）

③开发过程中遇到技术问题，且预估会耗费较长时间，可以请教相关同事协助解决，并及时对该问题及处理方法进行总结记录。

④提高用户体验，做好交互性效果。（比如用 JavaScript 和 Ajax 在表单提交等地方给用户 正确或者错误 的输入反馈等。）

⑤传递数据时，根据数据的复杂程度、逻辑的复杂程度等综合因素，决定采取某种形式去传递。（比如常见的传递id 可以使用页面拼接参数跳转传参；数据在多页面共享，就可以使用vuex形式去存储数据，避免使用父子组件传参或子父传参，导致代码结构混乱、逻辑混乱）

⑥条件判断的使用，虽然简单，但如果放错位置，也会有一些问题。合理的使用！、if、else嵌套等。

⑦代码的复用性，避免在开发过程中施展cv大法，意识到了组件封装的重要性，可以大大减少复制粘贴带来的冗余代码，提升代码的复用性。关于这一点，也是接下来的工作中需要花时间深究的重点。

⑧开发的思路要清晰，这个很重要。有时候会因为一个bug导致开发时间过长，其实就是代码逻辑和自己的开发逻辑上不够清晰，先跳出这个问题，理清整体的思路很关键。

⑨面对项目的心态同样很重要，有时会因为某些技术点的不自信，导致心理负担很重。经过这一段时间的磨炼和积累，学会了一些解决问题、解决bug、排查错误的方式方法，虽然还不是很成熟，但至少是有个方向了。把踩过的坑以及解决方法记录下来，不积跬步无以至千里。

3、开发完成后

要进行项目的测试。测试出的问题最好以文档的形式记录下来，项目成员共享此文档。这样既清晰明确，项目成员也都可以进行操作，便于处理结果及时标记。

三、总结

前端发展比较快，技术的更新迭代日益快速，不断的深入学习 夯实基础，然后再往外延伸。

正确看待bug，在bug中成长，解决bug的同时也是在填补自己的知识盲区，丰富自己。

注意开发中的细节，考虑问题从全局出发，而不只是局限在前端这个岗位上。