由于个人原因，没有参加所有校招，进入了一家前端要求比较低的小公司。公司前端的技术栈 Vue + Element-UI, 业务主要以 pc 端为主，也算是总结一下自己这一年来的收获和体验。
CSS
进来第一份工作是写 CSS。 挺神奇的，第一次听到的时候，有点神奇又有点繁琐。相当于外包的业务重复性高，但每个甲方的嵌入页面不同，所以会需要不同色调的设计稿，但功能大多类似。所以我的工作就相当于将所有用到的颜色变量从静态变为动态，用 CSS3 的 variable ， 然后将颜色集中于一个外部的 CSS，每个项目修改对应的值就可以产生不同的 视觉。此外就是一些， 视觉 bug 的 CSS 调整。
听起来像是很蠢的码农劳动，总结一下这段经历学到了什么：
- 调整 CSS 的时候，会注意到 lint 提示（这个为什么会突然出现下面再说），会警告提示，调整 CSS 属性的位置， 例如
position应该在最上方，overflow应该在下方等。 - CSS 权重， 因为抽离的 CSS 的颜色文件会统一在所有项目文件之前加载，所以在最上方。这是可能产生冲突。同时了解了
scope的实现。 - CSS variable 和 预编译（如: SCSS）变量的区别，两者在使用和兼容性上有什么弊端和优势。
- iconfont， svg 和 js （打包生成的那份）的区别
- 如果使用 CSS 预编译器来减少重复代码， mixin、 function、循环等。
npm 组件
这个时候之前 的 CSS 需求基本大功告成， 但这堆 CSS 总不能一直一个一个项目拷进去吧，于是建立了公司第一个 npm 包 🐶。之后还负责了第二个（基础和业务常用组件包），这里一起说一下。这个可以学到：
- npm 包的从 0 到 1，
package.json应该怎么写，每个属性对应什么。比如，区分dependencies,devDependencies,peerDependencies， 打包应该包括哪些文件，pack测试打包，ignore关系和优先级，link测试等。 - 配置打包工具，打包输出多个格式文件，区分兼容 ie 和新版本浏览器， 以及 esm，cjs，iife，umd 是啥各自用途。
- postcss 的作用及插件的作用和写法，大概看了一下 流程中 CSS AST 的格式和编写了一下自定义的流程，比如 将 颜色变量的行，替换值并生成一份只有对应颜色变化的主题（向下适配IE），推荐博客
- 对比了几种比较流行的打包工具的异同和发展，webpack， rollup， parcel（在自主性和易用性做取舍），理解 tree-shaking 和 code-split 的区别和使用，顺便理解一下 babel 流程和插件的写法（其实就是体验了一下 visitor 的编写），看起来很复杂，其实流程和规则很简单，难的是覆盖所有情况的转化逻辑，但这个一般不用插件管。(wepack 4 应该可以做到 parcel 相似的默认配置，提高易用性)
- 打包如何做兼容（browserlist），怎么查询兼容性（caniuse）
- 版本规范及changelog
虽然这里面很多可能没有用到或者不需要自己实现，但是看到就顺便去查了一下，然后就记录下来了。
日常开发
然后就是日常开发了，Leader 觉得我干的还行，就让我单独负责一个 web 的项目。扔了个祖传脚手架给我，内部大概提了一点建议，然后怎么架构怎么规划全权交给我。相当于给你设计图，你做出来，就行。技术栈就是上面的 Vue + Element-UI，不能用一些奇奇怪怪的库。单人写项目还是很爽的，自由度很高，跟写个人项目一样。
之后还单独负责了一个 web 项目，技术栈大体相同，所以放到一起讲吧。
设计相关：
架构项目上，采用了数据驱动视图的方式架构（不是 MVVM 但不知道叫啥）。差不多相当于你写的所有组件都是一个公用的组件，具体渲染的文本和功能依靠配置表来生成。比如： 一个 form，在配置表上写一个 key，label，type，页面就会读取配置渲染对应类型的 input，提交的时候也会对应增加这一项到表单中。
这种方式我不知道好还是不好，leader 是挺支持的。好处是十分方便迭代和复用（多语言需求）。但我个人经常会在配置型上纠结，写少了又觉得不够灵活，写多了配置文件又像一份脚本一样，多包一层编译的感觉。。
其他的架构思维大概主要在 DRY 和 三次原则之间做取舍，然后组件配置尽量将大多数值设置为 默认值且尽量做到无配置可使用的易用性，过多的属性则应该拆分（可维护性大于复用性，后人看得懂才是王道）。近亲组件通过 mixin 复用，全局通过 util 复用。职责约束，组件内不归自己管理的数据和逻辑归还给对应父组件 或 子组件全权控制。
前端：
- Vue 的 复用性（3.0前）是依靠 extend， mixin， extends（不是属性，Vue 的方法）的，三者的区别的和取舍（其实前两个超级类似）。在复用期间，option 优先级 和 是否可以 增强还是只是重写。
- 全局弹窗，包括业务和登陆注册等功能，因为不知道会在哪里使用，使用 vue 绑定 全局方法，通过执行函数不同的 option 渲染不同的弹窗到文档流中，destroyed 的时候再移除文档流。这个可以学会 Vue 组件的写法。
- 增进了 slot 的理解，通过参数 slot 控制判断和渲染，进一步理解了 template 和 render 函数的关系，学会手写 render。
- 增长一些 Vue 的奇怪知识。比如 data 中可以直接使用 props，vue-filter，v-bind 对象数据，
@event参数，debounce/throttle在 mixin 中的 bug, 动态组件和动态 slot 等。其实很少人真的认真读完 vue 的文档再开发，里面藏了很多好用 语法糖，都是同事学习了很多。 - 沟通响应式的实现，通过函数统一管理全局的字体和视觉，在 公共 样式中可以通过
media实现全局字体的变化，还是挺酷的。这里要提一下这位大佬的一些思想 （上班的时候偶尔在打包和下载依赖的时候看，或者当背景音），设计规范先行是个很棒的思想（还有很多关于组件的建议）。 - 管理 Vuex 模块，action 和 api 的执行关系，通过 dispatch 递归或者复用逻辑。根据复杂度和需求选择使用 localStorage ， Vuex 和及 Vuex 是否需要持久化。
- 异步加载实现，作用和影响（实践：滚动关联，异步加载的动画效果），CMD 和 AMD 的区别，
magic-comment是啥(webpack 的特殊参数形式，比如 异步 import 转换可以用到)，加载优先级（浏览器行为）是啥为啥会有？（这个在资源网速一般的时候特别明显，甚至 block 住页面） - 打包工具的管理，全局样式文件（CSS mixin，variable，function 等）如何覆盖到所有文件，
hot reload与缓存（hash后缀）。还有 all in modules 的引用方式，以及关注 babel 新特性和提前体验一些还没通过提议的语法糖。 - 整理
package.json, 学会看package-lock.json，可以查看一些依赖关系，比如如果用了 postcss，就不用再安装内置的 SCSS 插件，如果用了@babel/preset-env就不用再装一次它内置的东西。
其他：
- 代码风格统一，stylelint， prettier，eslint，commitlint。CSS class 风格统一，有：BEM （我用的是这种）、bootstrap（所有间隔
-）、Semantic-ui（单词）、nec（关键字加-）。这是我目前了解到的所有 CSS 弱约束风格用第一种只是因为这种其他人听说过减少沟通和学习成本（且尽量降低权重）。husky 自动脚本（了解一下 git pre-commit 脚本位置和修改方式）。 - 项目内有一些 shell 脚本，辅助构建和测试，学了一下基本语法（同时修改了一下本地的，后面说）。因为要打包到不同环境测试，学了一下 except （一种自动交互式脚本，可以对应多个服务器数据库执行指令不需要密码交互。关掉测试服务缓存，热更新的 dev 模式 + except 自动部署的 bugfixing 效率让测试小姐姐眼前一亮）。
- 熟悉了 nginx 的配置，加深了对缓存，转发，代理，CDN 等的理解，加深 http 不同版本的理解和优化的点。
- 更熟悉了 git 的用法，rebase， stash，diff（配合 shell 脚本 和 regex 做简单的 lint）， reset，reflog， blame-mode（甩锅模式），submodules 等。
打杂
不知道其他人有没有这种待遇，就是你自己负责的项目完成的比较快或者轻松就会有一些空闲时间。这个时候一般不会奖励你闲着自学等项目进度啥的（可能其他公司有？），可能有一些其他项目比较慢或者忙不过来啥的让你去帮忙（xx: 都是前端嘛，上手有啥区别吗🐶），所以我几乎涉足了大部分公司前端项目和部分后端项目（python，刚好之前的实习就是干这个的。。），负责帮忙 bugfix 和迭代需求。这个打杂虽然是没有绩效的（说的好像其他有似的），但也不会有很急的 deadline，所以还是比较舒服的，不用加班还可以玩一下 Emacs 啥的。
但其实还是挺烦的，毕竟脑子要像切卡带一样记住，读取和切换每个项目的逻辑和架构，以及开发测试流程，而且都不太一样。虽然体验不是很舒服，而且经常出问题（比如需求评估，为啥你要花这么多时间看项目看代码，不能直接写？🐶），但还是学到一些东西的（这里有一个比较尴尬的问题，因为是打杂，所以大多是比较广而浅的知识点，缺少深入的机会和时间）。
前端：
- 体会了一下旧时代 SSR 的流程，AMD + Socket 的交互方式和无需打包（无package.json）的开发 测试流程，没有 打包就没有新语法或者 hot-reload，这个有种上历史课的感觉。还了解到 没有
async/await和promise的情况下，是如何执行异步流程的（async + waterflow） - cookie 的理解，跨域与跨站，HttpOnly，SameSite。
- service-worker 以及 fragment，不过没有深入。
- virtual-flow 实现和方案优劣，这里的 diff 可以有一些算法上的 思考。 全量 diff 的话 虽然数量不多的情况下体现不出来 diff 的效率，但算法的时间复杂度是 O(n) 的。
- nodejs 版本管理 nvm 和 进程管理 pm2。
后端：
- 复习了一下 python 基础，作用域（对比 js），生成器实现和作用（觉得有趣就看了这个），GIL，模块加载优先级 等。
- 环境管理，python 的 virtual-env 和 conda；命令行加速，和切换内外网 registry；包管理，setup以及打包发布等；代码规范 flake8, black, yapf； 自动测试 pytest。
- 学习了一些没听说过的（也可能偏数据而不是后端）东西，Jupyter/Notebook/IPython， pandas + numpy。
- 复习 MySQL, Mongodb 和 Redis 常用语句。
运维（还有一些奇怪的知识🐶）：
- docker 理解和使用，镜像的打包管理和分层优化，docker-composer 的使用。镜像的发布和 仓库管理。
- Jenkins 的部署和维护，job 的编写和 hook（其实就是写 shell。。）。
- shell 加强，查看 log 和文件，用户权限，查看进程的状态和内部线程数量，数据库导入导出，手动备份；输出 数据库结果或者 docker 结果到文件等。
- 搭建 gitlab，搭建 科学代理，黑白名单控制，修改暴露端口，查看非法访问的 IP 等。
之前还觉得挺开心，哇自己学了这么多。然后我朋友跟我说：其实没啥用，你的 title 还是前端开发，而且知识也都是皮毛并不会对你求职和工作提供什么帮助，只是浪费你自己的时间而已。就像面试官会想要一位 深入了解 MySQL 底层的人而不是一位了解所有数据库 CURD 的人，更何况你 3 年之内估计 title 都会是前端开发。假如你是 Java，就一心学深研究 Java 方向就足够耗费所有时间了。个人也比较认可这点，知识的深度是远远重要于知识的广度的。但是也不应该局限自己的眼界，感觉态度应该是不排斥，但控制消耗时间除非那会是你研究的方向。
其他
除了工作外，还学到一些其他东东。而且加上小公司办公通信基本微信为主（大部分被我拉去钉钉了），经常有机会摸鱼和聊天，同时也学到了一些工作以外的知识。
- Windows 上装了 ArchLinux ，配置了Optimus（大黄蜂的升级，兼容 N 卡，可以玩游戏了），不过习惯了 mac os，键位实在是不舒服，而且系统很不稳定，有很多种办法出现 bug 崩溃重装，当然备份也很容易。有个蛋疼的地方就是 Windows 装 Linux 可以不影响原系统分盘直接装，放过来就不行，Windows 必须清盘。
- 2019 个人评选最佳噶勒game : Emacs + Elisp（因为是你怎么t教她，她就会怎么做很听话🙈）。在之前 用 Sublime Text，觉得 一切都好但碍于墙不管升级插件，以及不会开发插件，以及不会改造，迁移环境困难等问题，在寻求一款轻量级的编译器（不是 IDE）。之前用过 ATOM 还是感觉太重了。然后在一位前辈的博客中偶然认识了 Emacs（和 vim 做了一会斗争，选择了她），然后 在 工作之余渐渐学习它的用法，从 demo 到工作 使用。
其实过程还算顺利，因为几乎所有习惯的快捷键 都可以轻松设置，哪个快捷键不一样，改成一样就完事了。然后跟着 学了 Elisp，和 git 管理 配置。就可以实现 插件的选择，一些简单的 功能改造 和 配置的持久化管理。
哪里不舒服就改哪里，不会用的 mode 快捷键都可以教你（不用百度或者问同事啥的），每个人都可以有自己的专属 编辑器（也基本用不了别人的。。），体验还是很炫酷的。看了官方的教程和一篇 一年教程。其实不用成为专家的话，半年不到就可以熟练使用了。。
这算是 2019 最棒的收获了。 - item2 + zsh 已经是标配了，然后跟 一位前辈了解到了 tmux 这款神器，免受手残不小心关掉 终端的 痛苦。通过 配置 tmux config 和 写一堆自己常用 alias 和 shell 方法，except 脚本 可以让自己的效率很高。
- 对于常用工具的改造，因为 Emacs 的缘故，让自己有了更个性定制自己的工具的想法。于是 对常用的 Typora 进行了 主题定制，还有 Chrome 组件定制。Chrome 发布还要银行卡和费用我是没想到的，不过也不打算发布，因为都是极其主观，是自己审美需求或者啥非人类的偏好，功能自己想要就做什么，基本不适合别人。
- 虽然工作用不到，自己还是通过网上认识的同行，一起做有意思的事情。同时学习一些工作没有用到的知识，比如 react，最新的 Composition-api (Hook)。不得不承认 Vue 适合小厂，React 更适合大厂。因为技术基础的不一样，写出的代码 用 vue-template 不会差异很大，但用 React 的话真是千奇百怪。。
心态和未来
虽然进来的面试和工作需求都挺简单的，但自己着实学到了不少东西，无论是自学还是工作需要。事实证明这些积累哪怕工作暂时用不到，以后也可能会对你增值。而且会减少你的空虚和自卑感，不会老是觉得自己不如大厂的同届，哪怕真的有差距，也是在减少不会在拉大。这种心态个人感觉还是比较健康的，没有那么压抑（自卑和空虚真的很难受）。
其实 和公司里面的人相处还是比较友好的。毕竟要求这么低，钱肯定不多，钱不多还来干，肯定是年轻人嘛，也不会有啥代沟。之前看到网上的薪资决定我和老板谁是爹的段子还有一些技术 心得, 比较认同，觉得做技术还是不能太卑微太吃亏。想让我做事，就给钱，多做就多给，我负责解决遇到的技术问题，公司负责给我对等的薪资。这本来是很合理的。但感觉有的人呆久了，也慢慢变得隐忍起来。自己对薪资和提薪的不满也不会去表达，做的东西比别人多但没有对等的薪资和绩效，也没有表达，而是用其他娱乐的方式（titti entertainment）消磨时间去兑换更舒适的心态，不去做更有价值的技术积累，这是一种恶性循环也是一种面向虚荣（不想承认自己过的不如别人）的虚伪快乐。这样的人还是不是少数。举个简单的例子，我这周发工资，比我朋友少，但我技术不差他，这个时候我没有去跟公司说而是周末选择去打电动购物或者旅游消除情绪，争取周一以良好的心态继续工作。但这份难受还是在的，而且你打消了原本打算周末学习的知识和技术的计划，这使得你的价值和成长又逊色于花费这个时间在学习的朋友，进一步拉大薪资的差距和技术的差距。由于大部分公司要求薪资保密，同事之间不聊这些所以很多都沉迷在这个恶性循环中。当然这是我的主观思维，我并不知道他们心中的快乐是充实的，只是我自己会觉得空虚不爽。
所以我个人觉得，保持自己的进度和自信是十分重要的。这样，即使虽然你这个时候的薪资待遇不满意，你依然有自信去工作和同事合作，去负责更多的事情。因为你知道你在进步，在负责，这个时候是公司需要你，你并不是硬性依赖于公司的，当然会获得更多谈判的资本，同时其他公司随时都可能有不错的机会挖你，你会有准备。哪怕工资不到位，你在合作中引导或者分享了一些知识，同事领导拿着和你同等，或者更优的待遇，与如此优秀的你共事，也会对你感到敬畏。这会成为一种口碑，也是对自己被人需要的精神需求的满足。（这种口碑的价值会在离职留人的时候爆发🐶）
这份心得除了分享之外，同时警示自己和大家，哪怕在小厂（甚至可能都不算厂。。），也不要忘记自己的初心和自信，不可以甘于现状否定自己。
