初探
第一次接触前端开发是在 2014 年，当时是大二上学期，学校有一门课程叫 Web 网页基础，老师只教 HTML，其他都没教，当时还不知道 CSS 是什么东西。老师只教 HTML 还教得很烂，当时对这块很感兴趣，于是我就自己网上找资料自学，从此踏上了不归路。
当时很幸运，找到了 “李炎恢” 老师的视频，讲得很细心很详细，我的 HTML、CSS、JavaScript、JQuery 都是跟着他的视频学的，可以说是我的启蒙老师了。JQuery 学完后，我发现我爸很喜欢玩连连看，我当时就用 JQuery 给他做了一个连连看游戏 (源码地址)，仿照他平时玩的那款游戏，功能做得很全面，玩法模式很多，还有游戏音乐。
后来看到了一个叫 “潭州学院” 的线上公开课，每天都有课。因为是公开课，所以每节课都是为了打广告，找了很多很炫酷的特效作为例子教大家怎么做，大家听不明白再怂恿大家报正式课。但是我听得懂，每节课我都跟着做出来，慢慢的就积累了一些开发经验。听了一段时间的课后，我也做了挺多页面了，慢慢的那些页面和特效我都知道怎么做了，效果图出来我就有思路了，就没再看了。
暑假实习
之后一段时间都在研究 Java，直到暑假被老师推荐进一家创业公司工作。虽说是以实习生身份进去，但里面就我一个前端开发，前端任务都我包了。公司是开发 APP 的，需要做 H5 宣传页面和 H5 小游戏。
首先说说 H5 宣传页面，从来没开发过移动端页面的我，当时的我连 rem、flex 布局都不知道，只能试着用 PC 端的思维去开发。结果还是出问题，不同屏幕展示结果不一样，有些屏幕有问题。不懂怎么处理不同屏幕的展示问题，当时公司也没人懂，需求还想让我禁用微信的下拉刷新功能。那时候才真叫绝望，才大二的我为什么要经历这些。当时也不太会查资料，都是自己研究，后来想到的是用 JS 动态设置宽度来适配不同屏幕。
H5 小游戏也是让人绝望，最初用 div + css 开发，做出来效果太卡，后来换成 canvas，边学边开发。给我的需求是给我看一个别人做的游戏，要我模仿出来，而且还嫌别人做得不好，要我改进下，让它变得更有趣点。凭什么认为我这个毫无经验的人能做出来？当时只能心里暗骂，也不敢拒绝，只能咬着牙好好干。没想到后来还真被我做出来了，需求人员很满意（其中一个的 源码地址），我发现自己还是很有潜质做这行业的，可以继续学下去。
暑假结束了，正好任务也都做完了，回学校自己学习，这次更加坚定自己的道路，不去研究 Java 了。临走前那里的后端老大给我推荐了 AngularJS，当时第一次听到这个词，才发现原来前端也有框架啊。我觉得听到 AngularJS 这个词是这次实习带给我最大的收获，顺着这个词查下去发现了好多东西。原来前后端可以分离，原来接口可以走代理不会有跨域问题；原来 CSS 还有预编译语言，CSS 还能有变量和函数；原来还有 Grunt 这样的东西可以实现前端建。大三上学期把这些东西学了个透底，再加上 HTML5 的东西，实习时存的疑问全部解开。
第一份正式工作
大三上学期还没结束就找到了一份工作，职称叫 H5 工程师。然后请长假去工作。当时是大专，属于大学最后一年，那时 12 月份到 9 月份一直在工作。这份工作是做电商平台的，跟淘宝差不多的页面，做做各种商品列表、商品详情、购物车、活动宣传页之类的。公司属于分公司，才二十个左右的人，刚开始前端人员就一个刚入门的新人和我两个人。我才刚去不久就让我面试人，让我做前端负责人，被吓死。说好的有大佬会过来，果然我是被骗过来的。既然是我负责就 AngularJS 用起来，之前是用 JQuery 的。然后还真的用起来了，后面入职的人也都要求学习 AngularJS ，我就这样成了公司的技术栈开创人。
在这 9 个月工作中，没有像之前那样慌乱，也没遇到什么大问题，一切都很顺利，逐渐成为 AngularJS 的熟练工，慢慢积累项目经验。开发一段时间后，开始注重代码质量，服务层是否做到职责单一，控制层里的东西是否可以抽离一些出来。sass 也开始注重封装，比如 0.5px 边框样式。
工作这段时间不断的出现新东西，当时是 2016 ，前端界最活跃的一年。经常听到有人在讨论 Vue，与之对比的是 React ，那时我才知道 React 的存在。还有被称为配置工程师的 Webpack 也是那时候出来。还有 React Native ，当时听说前端也可以开发 APP 就很兴奋。然后我就生出了一个念头：“要不专升本吧”。决定再学两年，一来想回去再享受下校园生活，二来想趁大学比较闲学下这些新出的技术，三来是想转专业，学下一直感兴趣的新媒体专业。
本科进修
这次回学校是以本科的身份进去，大专跟本科也没什么区别嘛！最大是区别是要修学分、做毕业答辩。在这两年期间基本都在学习，学了 Vue、React Native、Webpack、NodeJS，还有很多 UI 框架。独自完成了需求分析、界面设计、前端开发、后端开发、部署、写各种文档。系统有门户端、管理端、App 端，还做了二维码扫描登录，用 WebSocket 做三端关联。还引入了 PWA 做交互体验的极致优化，还做了很多 Webpack 性能优化。这就是我的毕业设计项目，现在公司做的都没有这个好，毕竟花了很多时间的。
在校期间出了微信小程序，我同学的朋友想创业，拉我接外包。微信小程序刚出来，到处都是坑，做得我都有心理阴影了，也让我学会了很多填坑的技巧。
新媒体专业让我学到了不少设计技巧，虽然没什么设计天赋，但至少工具用得挺熟的，PS、AI、AE、PR，工作中还真用到了。这些设计技巧为我后续做的动画开发打下了很好的基础。我喜欢设计，喜欢有创新的东西，做前端开发有一部分原因是希望这个职业能带我见识很多有意思的设计。
两年时间很快就过去了，又要出来找工作了，我这又毕业了，之前的四年开发经验要归零了，我又从应届生开始了。这次要找个好一点的公司了，于是我跑到了广州，结果好几天没收到一个面试邀请。在大城市，学历和学校的重要性体现得淋漓尽致。最后是有收到几个 offer，但是公司不是很满意。然后我同学邀请我去他们公司，大老远从广州跑到福州，结果人家 HR 不要人，我就这样落魄的又回到了厦门。那时已经错过了最佳的招聘季了，好一点的公司基本招满了，最后进了一家还过得去的公司，真是一次失败的求职一路。
第二份工作
这次的这家公司比较正规，有专门的前端部门，有真正的大佬坐镇。刚进这家公司的第一印象是：这工作区好阴暗，这些人都好冷漠，好想逃离这里，好后悔选择这家。所以公司的环境还是很重要的，环境真的是可以决定一家公司的好坏。
公司使用 react 技术栈，我之前所学要全部抛弃了，一切从头开始。刚开始使用 react 给我的感觉是：这也没有，那也没有，什么东西都要自己实现。我感觉我的技术在退步，我的开发效率以 75 度快速下降。但这只是短暂的，React 有了一定的积累后速度慢慢就快起来了。随着熟练度慢慢提升后，开始研究各种写法，然后就会发现各种惊喜，常常惊叹到：“原来还可以这样写！”，然后就慢慢喜欢上 React，特别是出了 React Hooks 之后。
在这公司学到了很多：
- 前后端交互：后端开发人员先在 YApi 定义好接口再开发，前端开发人员可以先使用 YApi 接口进行开发，等后端开发完了再切换地址。
- npm 和 GitLab 私库：公司内部的东西放在私库，只有公司内网环境才能读取到
- 禅道：日常工作管理，比如记日志、建任务、建需求、提BUG等
- 发包流程：Jenkins 管理
公司有自己的组件库、脚手架、工具库，虽然这些都不够完善，也给工作带来很多便利性。想要学得更好，还是要有主动性，技术方面学到最多的就是看大佬的代码。从大佬的代码里看到了很多技术，比如 immer、render props、recompose，还有那一套脚手架的运作原理。在他的聊天中了解到很多技术方案，比如领域模型、整洁架构、中台、微前端。
随着项目做的越来越多，我对整个公司的组织架构，软件的运作流程也慢慢了解了。一个项目的形成是收到标书开始的，标书通常是市场部或者老板找来的。然后将标书交给项目经理，项目经理去找人，看哪些人有空，组成一个项目团队。项目团队前期一般由项目经理、产品经理、后端开发人员、前端开发人员、测试人员、UI设计师组成，后续可能会加入数据支撑人员、实施人员、技术支持和运营人员。整个过程如下：
- 项目经历负责把控整个项目各个环节的进度和整体任务安排；
- 产品经理负责将标书的内容转化为需求文案和原型图，做好后把相关参与人员拉来召开需求会议；
- 开完会议后，后端人员根据原型和需求先设计，出 YApi 接口定义再开发，前端搭建环境做准备工作，UI设计师根据原型和需求开始设计；
- UI设计师出了设计稿了交给前端，前端正式开始开工；
- 后端接口开发完毕后通知前端，前端开始联调；
- 前端开发的开发属于开发里最后一个环节，开发完成后就算本次需求完成了，发包交给测试人员去测试；
- 测试出 bug 了给相关人员提 bug，改完后再次发包，就这样往复循环直到没发现什么问题，或者到了上线时间；
- 测试人员测完后交给实施人员，实施人员将系统部署到现场环境，现场环境可能是线上服务器，也可能是客户的电脑上；
- 项目上线后对于用户就是一个系统，系统可能需要数据，就需要数据支持人员整一些真实数据弄上去；
- 系统的运营可能需要一些客服之类的角色，这时候就居然技术支持的介入；
- 系统可能需要做一些推广活动，这时候就需要运营人员介入；
- 系统运行一段时间后可能发现 bug 就回到第 7 步，可能会产生新的需求，这时候产品经理就会介入，然后回到第 2 步。
以上是我从前端人员的角度对整个流程的理解，这让我意识到原来一个项目有那么多人参与。开发项目还是得多熟悉下业务，从业务的角度去看待问题，很多疑问自然而然就解开了，
入职一年半
大概在入职一年半的时候，我接手了一个项目周期长达一年多的项目，我成为了前端负责人。刚开始是三人前端团队，我一个人管着两个经验比我丰富的人，我分配任务的时候很没底气，不知道怎么分比较好。于是就分一些难一点的给他们，自己留一些简单的。结果他们做的比我还快，很快的做完。然后我就再给，然后又做完了。心想这些人真强，这开发速度没得说。等后续闲下来了，再去看看他们的代码，这真是把我惊艳到了，这写的什么鬼啊，代码写得又臭又烂，简直毫无复用价值，难怪做那么快。后来他们的代码我全部找了时间重构了一次。这故事告诉我，很多事不能光看表象，经验不代表实力，大佬也可能是被别人吹出来的，一定要自己验证才行。
后来那两个人都去做其他项目了，给我另外安排了一个，变成两人团队。这次为了避免之前的事件发生，让整个项目保持可控状态，决定做一套项目架构和定制一套代码规范。这过程做了很多尝试，加了很多班，有时候回家还继续加班到凌晨两三点，所幸最后的结果是好的。我的队员也很优秀，非常配合的遵守规范。
前端负责人的主要职责就是把控项目进度和把控代码质量，还有就是有事永远是我背锅。前端开发的任务分配很多人都是按照页面分任务，其实这样很容易重复造轮子。最理想的状态是前端负责人先总体设计一遍，然后将各个页面进行合理拆分，最终拿到的任务应该是谁谁谁负责做哪些组件，谁谁谁负责拼成哪些页面。
总的来说这项目让我学会了一些道理：
- 做项目不应该只考虑当前页面的开发，而是应该从整个项目的角度去考虑，这样才会积累一些组件或工具，才会越做越快。
- 做项目也不应该只考虑自己如何快速开发这个页面，而是从团队的角度考虑，写了一个组件或工具的时候考虑下是不是别人也可以用。有想法的时候将手下的任务先交给别人，专心去做可以提高整体效率的工具。
- 做项目不应该只考虑当下的任务，而是多想想未来的任务会不会有可能出现同样的需求，考虑提前封装下，如果当下没空封装，至少代码设计的时候也要考虑下。
入职两年
大概在入职两年的时候，我被邀请加入前端基础建设团队。这就意味着有些技术我有能力申请使用了。整好有一个新项目来了，我申请使用 TypeScript，这算是公司首个使用 TypeScript 的项目，对这方面没人可以指导，只能自己瞎捉摸。
这里特别提起 TypeScript 是因为使用这东西开发确实能带给人巨大的进步（不使用 any 的那种），简单的说就是它能迫使我们好好写代码，别浪！一个函数定义下去就要想清楚它的用处，它能接受什么参数，返回什么数据，想清楚再定义，否则给你报错，这就是使用 TypeScript 的感觉。还有就是使用第三方变量和方法，你每次使用一个对象你都要清楚这东西是什么，了解清楚了再用，否则小心我给你报错，哈哈哈！所以就经常要点进去看类型定义。
TypeScript 用久了之后就再也不想看文档了，会习惯性点进去看源码，久而久之就不排斥看源码。很多时候遇到问题了，直接看源码查原因是解决问题最快的一种方式。然后慢慢的就会对各个源码很熟，就更能理解底层原理，很多问题就能轻易避开。就不会再因为一个问题到处百度谷歌还找不到方案，研究一整天都不一定解决。
同样入职两年左右的同一时间点，我报了拉钩教育的大前端高薪课程。一直以来都是自学的我，这次终于系统的学了一遍，解开了我很多知识盲区，很值！相关的笔记和作业都放在 Github 的上（传送门）。
未完待续...
