【扯】免费前端教程不会告诉你这些—知乎live摘录 - Go语言中文社区

【扯】免费前端教程不会告诉你这些—知乎live摘录


本文大部分内容来自知乎live—免费前端教程不会告诉你这些

本文大部分内容来自知乎live—免费前端教程不会告诉你这些。

笔者感觉这里live整体质量不错,大纲如下:

对前端感兴趣的同学可以去听听学习一下,一定会受益匪浅的。本文重点摘录了前端的发展历史和前端进阶过程中的建议。

【观点摘录】

  • 1 大厂不会在意你会不会某一个框架,他只在意你能不能再两个月之内快速学习上手一个新框架。

  • 2 如果你已经工作三年了,别人是不好意思骂你的(当然有意提携另说)。但当你是新手时,就应该在空白期尽可能暴露自己的缺点,然后及时修补(一定要补)。

  • 3 只有运气特别好时,公司的项目才可能带着你跑,一般情况下,公司的业务并不能带给你提升,码农需要有自己的side project。

  • 4 看书|总结|输出(写或演讲)。学习的效果依次递增。

  • 5 判断基础的方法:去找该专业最经典的书,看目录,然后在脑海中回忆这些章节的内容。看三本,就知道自己基础的薄弱处。

  • 6 科班生和非科班生的差距仅仅是前者在无所事事时做了正确的积累,而你那时可能还在打游戏。

【前端历史】

1.混沌之初

在互联网诞生的初期,并没有前端工程师这一概念。网页一开始是由后端程序员开发的。其网站特点是无设计、布局简单、样式朴素,没有动画。因为他们是用table做简单的布局。

2.美工救场

后来由于审美需求,增加了美工这一职位,他们用ps制作网站的设计图,然后编写css+div布局的html(该方式替代了table布局)。

3.gmail发布

2004年google发布gmail,这一里程碑标志着web app的概念正式登上历史舞台。全世界的程序员发现利用js居然还能做出具备pc端功能的应用。于是乎,有一部分程序员开始着手于js的研究。

4.前端第一次革命——ajax

gmail出世后,越来越多的后端工程师投入到js中去,从JavaScript的命名也能看出,js早在前期有讨好java程序员的倾向。

ajax本质是利用js发送http请求,并将获取的数据填充到页面中去。微软是最早使用js发送http请求的,早在IE5里,微软就内置了一个对象可以利用js发送请求。可以说微软提出了ajax的概念,google发扬它。

此时编写网页的模式就是:美工负责页面细节+后台编写业务逻辑+后台编写js完成交互

5. 提升用户体验阶段——前端工程师粉墨登场

在用户体验不断被强调的背景下,页面里js的复杂程度随着交互的复杂不断提升。后台程序员在维护js代码上表现地越来越分身乏术,毕竟他们还需要维护后台的逻辑。在这种情况下就需要一个人员,专门来负责编写页面当中复杂的js逻辑。至此,前端工程师正式登上历史舞台。

此时的工作模式如下:
(1)设计师:负责网站设计稿和标注
(2)后端:负责网站后台业务逻辑
(3)前端:负责网站的表现和交互部分(html+css+js)

这样的工作模式使用一段时间后,就发现了一些问题。

前端的html代码是依赖于后端的模板引擎的。例如html文件正在后端是以jsp的形式存在的,那么前端在编写js部分的代码时,若果想要看到完整的页面,就必须具备与后端相同的开发环境。

也就是说,前端工程师需要把后端的代码放在本地,然后将后端工程运行起来,成功之后,再在jsp(模板文件)里编写js代码。

所以,这样就容易导致前后端分工不清,而且在开发流程上存在比较严重的依赖关系。

6. 剥离阶段——前后端职能强化

从第5个阶段的描述可以看出,在传统的服务端渲染页面模式下,前后端存在分工不明确,开发流程耦合的情况,为了提升开发效率,必须做适当的剥离。

(1)html完全由前端控制,后端服务化,不再触碰UI层。
(2)数据接口化。后台提供接口供前端调用,前后端通过ajax的方式通信。
(3)人员分离。前端后端一拨人,后端一拨人。

至此前后端的配合模式定型。但是新的问题也出现了,虽然不是技术上的问题。

这样分工协作后,我们再来梳理一下前后端的职能:
(1)前端:负责页面样式、UI。
(2)后端:提供接口服务(业务逻辑实现);转存数据至数据库;

那么对于公司而言哪个职位更重要呢?答案一定是后端,因为他管理着重要的数据和核心业务逻辑的强验证(虽然前端也会验证,但是前端的强制性明显弱于后端)。前端呢?负责UI。

因此可以看出前后端分家后出现了一个新的问题:职能强化了,但能力范围缩小,致使前端看起来“不那么重要”。

7.前端第二次革命——移动端设备兴起

移动设备兴起带来最直接的挑战有如下几点:
(1)适配。硬件设备(主要是屏幕)的适配(响应式)和移动端浏览器内核的适配。
(2)页面性能优化,尤其是在弱网情况下的快速访问能力。

此时在移动端的浪潮中,前端的地位进一步的强化,至此前端开发的概念也开始有了细分:
(1)客户端开发:特指android开发和IOS开发
(2)PC端开发:PC浏览器里网页
(3)H5:嵌入在移动设备里的网页
(4)PC客户端:不依赖于浏览器的PC桌面应用。

上述4个领域的内容,在后期被合并成一个词——大前端。

8. 第三次革命——Node.js 闪亮登场

nodeJS的革命性在于:它让JS的运行脱离了浏览器。这就意味着在前端工程师可以利用js在桌面、服务器、甚至移动端编写js代码。极大地丰富了前端工程师的开发场景(有点像万金油的德鲁伊)

在性能优化的过程中,我们时常需要对图片、代码进行压缩,打包,以减少浏览器的请求次数。同时,由于开发内容的日益增多,提高代码的复用性也被越来越多的前端工程师重视。于是自动化和模块化的呼声越来越高。

在自动化方面,出现了几款比较有代表性的工具,例如grunt、gulp再到后来的大名鼎鼎的webpack。当然伴随着这些工具诞生的,还有成千上万的插件,诸如解决兼容性的babel、压缩JS的uglyfy等,可谓是百花齐放。

在模块化方面,首先是对css的模块化,出现了诸如sass、scss的利用函数编程的方式编写css的库,提升前端工程师对css的复用程度。

接着是js方面angularJs,vueJs,reactJs,在ES6的基础上应用而生,同时还伴随着诸多优秀的UI组件库,例如antd、谷歌的material 。极大地丰富了前端工程师在开发工程中的选择性。

在node的加持下,js能力的不断提升,js开始向各个领域延伸。

  • 移动端H5:angularJS、vue、react三分天下。
  • 客户端开发:react native(本地跨平台)、Ionic(加载移动浏览器)
  • 服务端开发: 以Koa和express为代表的框架
  • 桌面客户端: node(后台进程)+webKit(UI层)模式的NW.js、electron

那么到这里,就可以看到js所延伸的领域已经非常广泛。虽然前端程序员“抢”了不少活儿,但是综合上来看,工资与后端、算法工程师之间依然存在差距。

【关于JS万金油的思考】

从上述历史可以看出JS涉猎的范围在不断扩大,似乎只要会了JS,各种以JS为编程语言的框架就已经算入门了,那么是不是意味着之前传统的工程师们会被前端工程挤兑不?

答案肯定是否定!原因概括成一句话就是:编程语言是共通,但都有自己特定的套路。

以后端为例,在编写服务应用时需要考虑非常多的问题,例如:
(1)内存泄漏问题;
(2)程序的并发性;
(3)与业务耦合的权限的控制;
(4)与数据库的链接,以及跨进程通信;
(5)服务端的缓存,会话的保持。
这些问题对于一个只写过html+css+js的前端程序员而言都是陌生的。可能他能够快速上手编写后台应用,但是却很难在没有打通关键点的情况下编写出高质量的应用。

再以android为例子,依然是存在和上面相同的问题,所以往往在实际开发的过程中,团队配比都是:若干个XX工程师+至少1位资深android工程师+至少1位资深IOS工程师。之所以都是资深的原因很简单,那就是当混合开发出现了难以解决的问题时,就需要这些资深的原生工程师去填坑。

所以JS跨平台跨领域的特性并不能完全挤兑掉已有的工程师们,但是一定程度上会增加他们所在领域的技能专精。即数量可以减少,但质量会提高。

【前端进阶】
一年前端:

  • 从60分到80分:不再仅仅满足能用,同时要关注用户体验,完善功能。
  • 模仿组件:看一下别人的代码,不要复制粘贴,看的差不多了自己手动写,然后对比,删掉,再重写写,如此往复。
  • 不要重复自己:在工作的过程中,不要重复自己所做的内容,要么所有改进,要么换一个岗位。
  • 不要满足于调用API:能不能制作一些东西给别人用。

三年前端:

  • 不在关注代码写的好不好,关注工作效率。尽量不加班,把常用的工具封装成组件,供自己或别人调用。或者把自己遇到的问题记录下来,避免自己后面再犯错误。
  • 做一些分外的事情:后端、产品、设计。
  • 管理上级,笼络评级(处理好人际关系)
  • 变成重要的人:对产品能够有深入的了解,记住了工作中重要的事情。(是不是别人有问题都来问你?)
  • 坚持写博客:对于产品、工作过程中思考和总结。
  • 模仿框架

笔者个人订阅号~欢迎小伙伴们关注
微信公众号-感谢关注

若有疑问可以QQ联系笔者,虽然不一定100%解决你的问题,但是可以交流探讨一波:2276604211

版权声明:本文来源CSDN,感谢博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。
原文链接:https://blog.csdn.net/w8897282/article/details/82878618
站方申明:本站部分内容来自社区用户分享,若涉及侵权,请联系站方删除。

0 条评论

请先 登录 后评论

官方社群

GO教程

推荐文章

猜你喜欢