两年经验以下的web前端们需要注意什么?

简介: 前些年自己堆前端岗位的经验总结
从正式参与前端工作一眨眼两个年头了。我将这期间的经历经验分享出来希望能对某些同学有帮助,这就是写作的动力了,也算是补偿自己一个总结。当然这些全是个人观点,大神勿喷。

初入职场或将入职场

应聘

当然重点是首先如何争取到进入一家公司的机会。如果条件不是很好的同学(比如专业不是计算机相关,没有工作经验,前端知识来源自培训机构),应该切忌浮躁,大多数企业对于经验较少的新人看重的是这两点:1.人品2.学习态度
其次才是看技术基础,为什么呢?很简单,你愿意跟一个干了几年但懒懒散散上进心低的或者不好相处的人共事,还是一个虚心,学习态度好但是技术不是很好的人? 所以呢这些同学在准备应聘的时候不只是牢固基础,更重要的是在面试中展示自己上进心强,学习能力强的一面,给自己准备一个技术博客写点技术总结和心得,Github放点平时练习的小页面都可以,并在简历附上地址;还有就是保持谦虚和诚实,简历上就别太夸张啦。关于面试的心得就不多说网上很多。

下面唠叨一些同事相处需要注意的点,没兴趣的同学可以直接跳到下一大节。

称谓

对刚参加工作的应届生最大的变化就是环境,从无所不谈肆意青春的学校中走到看似庄严的办公楼,难免会有点忐忑。
首先是对同事的称呼,同职级的同事一般是直呼其昵称或者名字(如果有英文名更好),哪怕是带你的导师,哪怕是大你好几岁的同事。这样别人也不会太尴尬,聊天的时候也能平起平坐的聊到一起。慢慢就会适应这种关系了。对于领导,最好的办法就是别人叫啥你就跟着叫,有些领导还是不宜直呼名字哈哈。

请假

当请假的时候理由要简单自然,不要带着在学校里的调皮和稚气,比如之前有位朋友说他请假理由是"昨晚蚊子太多啦~",然后被领导训了;这种情况你完全可以说成"昨晚睡眠不好身体不太舒服",人之常情,领导一般会理解。请假的频率当然也不能太多,正真需要请的时候也要大胆去请,毕竟请假扣的是你自己的工资,当然是对公司没有什么损失的情况下你应该是理直气壮的。

团建

另外如果部门组织团建或者小群体自发去聚餐啥的最好是能去就去, 因为在工作时间你很少有机会跟一些人交流,待了两个月有些同事可能连部门里面某位同事的名字都叫不出。

不断调整对自己职位的认知

image.png

这一话题在前期就是对web前端这个职位的认知程度,说前期是因为你不可能干一辈子这行。

概念

web通俗的说就是网页,主体是由网页三剑客html+js+css及各种媒体和HTTP协议构成的技术应用。
前端是指在一个应用中的UI及其交互部分,有些人也把ios安卓叫做前端或者客户端开发。当然前端一般指web前端

技术栈

社会在进步,人们对某个职位的需求和要求也不断变化。近几年由于前端的学习门槛低和程序员薪酬较高等原因使从事和欲从事web前端的人猛增,并在技术岗位甚至所有岗位的竞争程度名列前茅。过去拿着Dreamweaver写页面已经是历史,只凭"HTML+CSS+JS"能混前端的日子也慢慢过去。
前端近几年的爆炸性发展已经促使着我们不得不随时准备接受新技术。

我们来回顾一下需要掌握或者了解的技术(不分先后顺序):

  1. HTML5(这个不用说了,肯定要熟练掌握)
  2. jQuery/Zepto (也不说了...)
  3. MV*框架 MVVM/MVC/MVP 框架,掌握一门,推荐Vue 其次是React
  4. 构建工具 (可以从Gulp入手,也了解下webpack
  5. CSS3 (一些常用新选择器,伪类伪元素,动画,媒体查询,flex布局等需掌握)
  6. CSS预处理工具 (掌握一门,推荐Less, 类似的还有sassStylus等)
  7. 模板引擎(掌握一门,MustacheHandlebarsJS,Jade,Ejs等);
  8. HTTPGet,Post的区别;HTTP headers请求头和响应头常见字段的作用;HTTP大体工作原理;常见状态码含义)
  9. Node.js & npm (合理利用npm的资源,node.js最好能用express,koa等去玩玩)
  10. PhantomJS (测试,爬虫,推荐库:Casperjs)
  11. ES6(即ES2015, 一些新特性新对象,比如比较重要的 Promise
  12. React native / weex (了解下跨平台开发)
  13. Linux ( 熟悉常用的linux操作,windows的同学可以下一个cgywin )
  14. 编辑器 (推荐VScode,其次sublime,Atom,webstorm,能装插件多装装有用好玩的插件)
  15. 版本管理工具Git必须掌握,其次是Svn
  16. Js基础(这个无论处在什么阶段都不能落下,包括对对象及原型继承,作用域等知识点的理解,可以看看js高级程序设计

前端还是后端

之前看到有的同学高喊“未来前端将会取代后端”这种毫无意义又自损形象的言论,很大程度是因为node.js的出现使得服务端上运行js不再是梦,我们可以使用js去编写后端程序了。但是既然写的是后端,它就是属于是后端的东西,我们可以这样认为:浏览器js是写前端程序的,而node.js可以编写服务端的。

image.png

更何况讨论前端后端的区分这个问题并没意思,老板要的是你怎么做出东西。世界上也不是只有node.js能写后端,并且不是所有的应用都适合用或者能用node.js写服务端。
所以当我们足够掌握了node.js并运用于项目,大可称自己为web开发,这样就无所谓前后端,毕竟这些的出现都是为了解决人们的问题。

学习方式

我看书的时候容易犯困,于是我失眠的时候就看看书...

image.png

后来发现这不是最适合我的学习方式,我更喜欢去一些社区看看好文章,因为这些都是别人把经验和知识压缩并展示出来的,是快速摄取知识的方式。
但也是因为网友们的文章水平不一,缺乏权威性,有些甚至是带有误导性的;另外文章的篇幅是有限制的,有些知识点讲的不够详细,使我们理解不够透彻和全面。所以书籍还是要看的,与其他学习途径相辅相成。并且要找到合适自己的学习方式。

这里推荐一些网站(当然还有很多,只推荐我觉得最好的几个,多了看不过来):

还可以在stack overflow,Github,知乎等站查找自己感兴趣的东西和灌灌水,这里都是不可多得的一片交流的天空。最好抽时间也写写文章,因为你自以为掌握的东西,在别人问起的时候或者要你写出来的时候就懵逼了,所以写出来让自己对所写内容更加清晰。

有同学肯定对学习具体的一门框架或者工具该如何学起有疑问。
答案是看它们的官方文档,有些比较亲民的文档会附有简单易懂的教程(比如vue.js的文档就很赞,并且有中文版),并且它们的api是最详细和权威的,这点毋容置疑。当然如果在看了文档后还不会使用甚至helloworld都没写出来的,就说明是对于他们的文档在阅读上出现了障碍,有可能是自己英文水平不好,也有可能是官方写的不够详细和通俗(当然这不能怪他们,能开源已经是一份心了)。这时候呢就去求助神通广大的网友们,Google一下看看别人怎么使用,总之,对于新框架的学习最好的还是不停的练习和查阅资料的迭代

属于jQuery的时代过去了吗

这节我们来单独聊聊这个近在眼前的话题。

image.png

近几年优秀的MVC/MVVM框架涌现出来,慢慢呈现出三足鼎立的局势,即 Angular,React,Vue。对于js开发者来说,这是一个巨大的进步。
尽管它们的存在并不与我们的旧霸主jQuery没有直接的对立关系,但人们出于用户带宽的和代码维护性等方面的考虑,很少把他们和jQuery放在一起使用,并且我们在大多数时候可以用MVVM的方式去实现jQuery基于DOM的编程方法要做的事情。这就暗示着"不是你死就是我亡"。
举个简单的例子,“显示一个元素”这个功能用jQuery来实现:

$("#el").show();

而使用MVVM是这样:

<div xx-show="isShow"></div>
xx.isShow = true;

但是我们如果只需要处理"显示元素"这类简单的问题的话,使用jQuery或者MVVM的方式都无所谓了。
当我们面临需要频繁的插入一大段含有js变量的HTML

//jQuery
var html= '<div class="panel panel-success">'+
                    '<div class="panel-heading text-center">'+
                        '<h3 role="button" data-toggle="collapse"aria-controls="content-banners-1" class="panel-title">{{title}}</h3>'+
                    '</div>'+
                    '<div class="collapse in" id="content-banners-1">'+
                        '<div class="panel-body">'+
                            '<div class="row">'+
                                '{{Content}}'+
                            '</div>'+
                            '<input type="hidden" id="upload-url">'+
                        '</div>'+
                    '</div>'+                    
                '</div>';

//然后做模板处理

//最后插入
$('#parent').html( html );

相比之下:

//MVVM

<!-- template -->
<div class="panel panel-success" xx-if="isShow">
...
<div  class="panel-title">{{title}} </div>
...
<div class="row">{{content}}</div>
...
//javascript
xx.title= 'title';
xx.content= 'hello,world!';
xx.isShow = true;

简洁性和可读性相形见绌。并且在越复杂的操作DOM的情况下,就能显示出MVVM的优势。另外在处理用户输入的等情况时候,双向绑定的便利就突出了。

我们虽然很支持去使用MVVM框架,但即便这样我们也不能下结论完全摒弃jQuery。有时候在浏览器兼容性考虑苛刻和对于一些兼写前后端的开发者来说, 学习成本低的Bootstrap + jQuery组合的地位还是有的。至此评定是否使用的MVVM的标准是:看项目是否允许和适合使用,兼容性有要求或者过于简单的没必要搭上这么重个东西,不然就小题大做,除此之外我们还是多去探索和尝试。
另外作为一名前端开发者,也要跟进时代的脚步,不能拉下对这些框架的学习,总会并且很快就有用到的时候。

合适的公司才是最好的公司

我们转回来谈谈观念上的东西。

image.png

很多年轻的程序员都想往互联网大公司跑,但是往往这些公司的要人标准都是自己达不到的,于是就比较焦急甚至怀疑自己。这样会影响自己在其他公司面试时的表现。
客观的说,大公司的福利、晋升、成长计划等制度还是比较完善的,并且如果公司的名号响当当,自己脸上也有光,再者大公司的产品成功概率还是相对高,开发者本身也有成就感。
不过在这种环境下,有些人就会变得懈怠,浑水摸鱼的也有。在较小的公司你的发挥空间会更大,并且会有机会去涉及更多东西,而不是大哥们给你写好的脚手架。
所以说,小公司一般能扩展你的技术深度,大公司则是广度
不过这不是一个老话题了,对于年轻的程序该去哪种规模的公司的讨论有很多。我觉得最重要的还是选择自己的合适的,当自己干着不爽并且有过交涉未能改善的话,就果断跳吧;
马云说过离职莫非两种原因:

  1. 干的不爽;
  2. 钱不够多.

我们应该学会去选择公司而不是被别人选择,如果不再愿意背着苦逼程序员的旗号的话。

非常感谢大家的阅读!!

相关文章
|
17天前
|
编解码 前端开发 JavaScript
构建高效响应式Web界面:现代前端框架的比较
【4月更文挑战第9天】在移动设备和多样屏幕尺寸盛行的时代,构建能够适应不同视口的响应式Web界面变得至关重要。本文深入探讨了几种流行的前端框架——Bootstrap、Foundation和Tailwind CSS,分析它们在创建响应式设计中的优势与局限。通过对比这些框架的栅格系统、组件库和定制化能力,开发者可以更好地理解如何选择合适的工具来优化前端开发流程,并最终实现高性能、跨平台兼容的用户界面。
|
17天前
|
前端开发 JavaScript 关系型数据库
从前端到后端:构建现代化Web应用的技术探索
在当今互联网时代,Web应用的开发已成为了各行各业不可或缺的一部分。从前端到后端,这篇文章将带你深入探索如何构建现代化的Web应用。我们将介绍多种技术,包括前端开发、后端开发以及各种编程语言(如Java、Python、C、PHP、Go)和数据库,帮助你了解如何利用这些技术构建出高效、安全和可扩展的Web应用。
|
18天前
|
编解码 前端开发 JavaScript
Web 前端开发中的最佳实践
本文将介绍 Web 前端开发中的最佳实践,包括代码组织、性能优化、响应式设计和用户体验等方面。通过遵循这些实践,开发人员可以提高开发效率,优化用户体验,并减少潜在的问题和错误。
|
1天前
|
前端开发 JavaScript UED
Web前端开发:探索技术与艺术的交融
Web前端开发:探索技术与艺术的交融
8 1
|
1天前
|
前端开发 JavaScript Java
前端与后端:构建现代Web应用的双翼
前端与后端:构建现代Web应用的双翼
|
11天前
|
前端开发 搜索推荐 数据安全/隐私保护
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
18 1
|
11天前
|
前端开发 JavaScript vr&ar
前端新技术探索:WebAssembly、Web Components与WebVR/AR
【4月更文挑战第12天】WebAssembly、Web Components和WebVR/AR正重塑Web应用的未来。WebAssembly允许C/C++等语言在Web上高效运行,提供接近原生的性能,如游戏引擎。Web Components通过Custom Elements和Shadow DOM实现可复用的自定义UI组件,提升模块化开发。WebVR/AR(现WebXR)则让VR/AR体验无需额外应用,直接在浏览器中实现。掌握这些技术对前端开发者至关重要。
16 3
|
1月前
|
机器学习/深度学习 前端开发 算法
利用机器学习优化Web前端性能的探索与实践
本文将介绍如何利用机器学习技术来优化Web前端性能,探讨机器学习在前端开发中的应用,以及通过实际案例展示机器学习算法对前端性能优化的效果。通过结合前端技术和机器学习,提升Web应用的用户体验和性能表现。
|
1月前
|
移动开发 前端开发 HTML5
Web前端全栈HTML5通向大神之路
本套课程共三大阶段,六大部分,是WEB前端、混合开发与全栈开发必须要掌握的技能,从基础到实践,是从编程小白成长为全栈大神的最佳教程!
48 3
Web前端全栈HTML5通向大神之路
|
1月前
|
监控 前端开发 JavaScript
构建高性能Web应用:前端性能优化的关键策略与实践
本文将深入探讨前端性能优化的关键策略与实践,从资源加载、渲染优化、代码压缩等多个方面提供实用的优化建议。通过对前端性能优化的深入剖析,帮助开发者全面提升Web应用的用户体验和性能表现。