如何在公司里体现前端的价值以及提高本身的议价能力

前言

最近在闰土大叔的前端圈里有不少小伙伴南下杭州应聘求职拿OFFER，货比三家以后，最终入职了适合本身的公司，而且还拿到了不错的薪水。在这些小伙伴当中，不乏刚刚大学毕业或者师出培训班的职场萌新，在顺利找到工做以后，该如何在公司里体现前端的价值？你又该如何在前端圈里提升本身的议价能力呢？

别急，接下来且听大叔娓娓道来。

先来聊聊国内的前端现状

今天我主要想讲讲前端工程，这是目前国内的前端主流模式，这其中就包括了webpack 和 Vue.js。

我怎么看现在的webpack

webpack已是一个咱们开发WEBAPP这种类型的项目的时候，离不开的工具。webpack能帮咱们解决很是多的问题。做为一个前端开发人员，在可见的几年内，咱们都须要去增强本身webpack的能力。或者说未来可能会出现一个相似于webpack，或者比它更强大的工具，那么这么一个工具是可预见的，确定会存在的一个东西，而这个东西会在很长的时间内成为咱们前端去衡量一个开发人员的能力是否强大的一个标准。

来聊聊Vue.js在国内的现状

Vue.js做为如今前端圈的框架里首屈一指的存在，尤为是在国内，用的很是多，应该来讲已经超过了React的使用量。并且如今Vue.js依然处于一个很是好的社区氛围当中，它的开发速度，新的功能的增长速度都很是的快。而后它的BUG解决的效率也很是的高。

Vue.js的做者在他的发布过程中，为咱们解决了很是多的在开发过程当中遇到的工程问题，好比他给咱们提供了.vue的开发模式，让咱们能够很是方便地去写一个组件。而后官方发布了Vuex、Vue Router这些工具包，这在React中有类似的参照物像 React Router、Redux。这些工具包都是Vue.js官方去开发的，因此它的维护性会比React 中的第三方维护的要好不少。在这种状况下之下，国内的不少工程师，在作前端项目以后，愈来愈多地选择使用Vue.js做为开发框架。因此咱们做为前端开发人员去学习Vue.js，是咱们须要掌握的必不可少的技术栈。

谈如何体现前端的价值

在如今的前端开发当中，重点和难点并非咱们的业务开发。由于大部分公司的业务并不会特别的复杂，并且每一个公司当中他们的业务是不同的。因此你在学习一门技术的时候，你若是花不少的时间去作业务开发，其实你的效率是很是低的，由于你没有学到真正的内容。

在公司中咱们的前端应用，也就是客户端应用，它是放在每个人的电脑或者手机里面去跑的，每一个人跑的都是单独一份。因此它们的性能不会特别的高。由于不少的公司的业务不会很复杂，不会像那种要在线编辑，PS图片这种工具要求性能会很是高。因此在性能不是特别大的问题的时候，咱们更多要考虑的是工程化的问题。

因此咱们如何在前端圈体现出本身的一个价值呢？接下来咱们将围绕如下四个Keywords来具体阐述：

（1）搭建前端工程

首先，咱们要学会如何在一个项目中去搭建工程。由于如今前端变得愈来愈复杂，不像是之前咱们前端开发一个页面，开发一个模板，一个简单的DOM交互的动画，一些CSS样式，这些东西咱们写好以后交给后端，他们去填数据就能够了。

那如今不同，如今的前端业务逻辑都在咱们的工做范畴以内，咱们要去作不少的东西，好比说数据缓存，这时候咱们必需要考虑一个工程化的概念。否则的话咱们代码太多，很差维护。

咱们写起来效率会很是低。并且咱们如今的前端开发并非所见即所得了，咱们要使用ES6，使用LESS，这些东西咱们都不能在浏览器里面直接跑，可是这些东西又能够加快咱们的开发效率，因此咱们但愿去使用它。那么如何去平衡这二者之间的关系，这就是咱们在前端工程中须要考虑的问题。

（2）网络优化

网络优化涉及到的更多的是基础概念，好比说咱们HTTP的理解，由于咱们全部的静态资源都是经过HTTP去加载的，如何才能去加快咱们HTTP使用的速度，如何去缓存咱们的HTTP请求，这些东西只有咱们理解了以后，才能更好的去优化咱们的前端工程。这些东西如何去作到，这也能体现出你的价值。

咱们但愿去减小HTTP请求，咱们但愿去压缩静态资源的文件，咱们但愿使用浏览器的长缓存，让应用的流量可以变得更小，加载速度变得更快等等。

（3）API定制

在咱们作前端应用以后，大部分项目的开发模式是先后端分离的，不是之前在浏览器里输入一个URL，后端填数据操做HTML模板，而后返回给用户的。这是咱们之前看到的HTML页面。

跟如今不同的是，咱们跟后端的交互都是API请求，好比说JSON数据，这个时候咱们要跟后端达成一个合做协议，由于API是涉及到前端和后端的，咱们是使用方，后端是提供方。若是后端提供的很差，那么咱们前端使用起来就会很是的难用，因此这个咱们要如何去跟后端进行交流，须要咱们去理解后端去开发一个API接口是如何去作的等一些简单的概念。

若是你不懂这些，你没法去跟他们交流，那么你只能听他们后端说，“ 这个东西你刚才说的咱们作不到啊~ ”，而后你没有办法去反驳他。那这样的话，就跟产品经理走过来跟你说，这个需求必定要作，但你跟他说 “ 这个用前端技术实现不了的~ ” 这个概念实际上是同样的。

因此，若是你不但愿作一个被忽悠的一方，那么你就要去了解他们这边如何去作这个事情。

（4）NodeJS层

NodeJS如今在前端开发中用的很是的多，举个最简单的例子，好比前端工程的搭建，都是围绕于NodeJS。好比咱们的webpack，Gulp，Grunt等这些工具他们都是在NodeJS环境里面去运行的，不是在咱们前端环境里面去运行的。因此你要有基本的NodeJS使用的概念。你要去学这些东西，至少要知道如何用NodeJS去写一个脚本，让它在咱们的Terminal命令行里面去跑起来。只有这样才能把咱们的前端工程去运行起来。

同时有不少公司已经把NodeJS运用起来，他们会在前端和后端的API层之间，去加一个NodeJS层，用NodeJS去作一些分发，数据处理，因此说，若是你但愿你的前端议价能力愈来愈高，那么你必需要去学NodeJS的一些东西。而你在学NodeJS的过程中，又会去增强你的API定制的一些理解。当你学到后端的开发以后，你对网络的一个概念，对HTTP请求的概念，也会变得愈来愈深。因此，你如今去学NodeJS，性价比是很是高的。

后记

说了这么多，我想告诉你们，你如今去学一门前端框架，当然很是重要，可是你不要把更多的时间去花在你使用这个框架去作业务开发上面，业务开发不会特别的复杂，或者说它须要你的知识能力并不会特别的高。

不少童鞋知道，若是公司要使用Vue.js框架，会使用vue-cli这个脚手架工具，给咱们去生成一个项目。生成项目以后，你只须要去写一个项目就OK了，你的项目就会跑起来。

可是你要知道，使用vue-cli生成的项目，在不少公司里面，是没有办法直接投入到生产环境当中的，由于他是一个普遍适用的模板，可是每一个公司在业务上是不一样的，他们确定多多少少会在这个工程有一些定制的需求。

那这个时候若是你没有办法去理解vue-cli这个项目是怎么跑起来的，那么你就没有办法去定制它，去修改它。那么这个时候，你就没有办法去撑起一个公司的前端部门的项目搭建这个工做，那么你的前端议价能力会变得比较的低。而vue-cli生成的项目其实就是基于一个webpack的前端工程，那么它里面涉及到的东西你就要去理解去学习它。这样才能把你的价值往上去提高。

因此，当你在公司中体现出你做为前端的价值来以后，你的议价能力也会随之水涨船高，获得提高，这是一个相辅相成的过程。

谨以此文，与君共勉。

最后，想看闰土杂谈系列文章，欢迎关注个人公众号：闰土大叔。