前端最努力的同学都是如何学习的?

2021-11-16 11:37:30 浏览数 (1)

大家好,我是二哥呀! 先说一下我个人对前端职业发展前景的看法,希望对那些站在前端学习起点,或者已经在路上,但又有点犹豫和迷茫的小伙伴一点点启发和帮助。

我毕业那会,也就是大概 10 年前,如果你在学校的时候做过类似于“图书管理系统”这样的项目,就可以拿到淘宝的 offer,那发展到现在,能做到这一点的候选人实在是太多了!

但前端发展到现在,要求也越来越高了。比如说天猫的消费者前端导购页面,为了提高购买的转化率,用户体验做了非常多系统化的优化升级,复杂度很高。

一、通用学习方法

前端开发上手快,又容易得到反馈,页面效果即时可见,所以我推荐的学习方法是:

学一点内容就快速实战,从实战中找到成就感,发现问题,再带着问题回去系统化的学习,如此往复。

二、基础

1)HTML CSS

这部分的学习建议到 W3School 上学习,边学边练,学习的过程中可以打开浏览器的开发者模式,方便查看和调整。

2)JavaScript

这部分的学习内容非常多,从初级到高级,有很多内容需要学习。如果没有其他编程语言基础的话,学习起来就需要多一点点耐心。

先看一下阮一峰老师的 JavaScript 入门教程,内容从最简单的开始讲,循序渐进、由浅入深,并配合了大量的代码实例,非常适合初学者。

https://wangdoc.com/javascript/

之后建议看一看《JavaScript 语言精粹》这本书,这本书能够帮你确认 JavaScript 中哪些是精华,哪些是糟粕。

像JavaScript 中变量的作用域、变量传递方式、函数的定义环境和执行环境、闭包、函数的四种调用方式(一般函数、对象的方法、apply、call)这些内容在这本书中都有详细的讲解。

就目前来说,市场比较缺的是高级前端,所以如果想要进阶的话,必须要学一下数据结构与算法。

为什么要学数据结构与算法呢?

因为这是解决复杂问题的必备武器,比如说,如何把一个多级嵌套的数据对象,转换成扁平的 Map 结构再提交到服务器。

更为关键的是,数据结构与算法是计算机的思维方式,比如说分治算法的思想,对模块设计以及系统设计都有着较大的影响。

三、初级

有了基础以后,就可以进行一般的静态网页设计了,如果想要进阶的话,还需要学习更多的知识。

1)CSS

CSS 的学习可以分为三块:基础概念、CSS 2.1 规范、CSS 3 规范。

建议到 GitHub 上看一下这份通用 CSS 笔记、建议与指导,第一部分探讨了 CSS 的语法、格式,并且分析了 CSS 的结构;第二部分围绕方法论、思维框架以及编写规划展开了对 CSS 的讨论。

https://github.com/chadluo/CSS-Guidelines

2)JavaScript

为了能胜任 JavaScript 编程,你必须在之前的基础之上进一步学习,像三个前端框架:React、Vue、Angular,可以挑选其一进行深入学习。

Vue.js 官方文档,讲真,学习一门新技术的时候,官方文档肯定是首选。我推荐的策略是以理解为主,难以理解的内容可以暂时跳过,因为死磕的东西可能一时半会用不上。快速把文章看一遍,扩充自己对这门技术的认知,对以后掌握它会很有帮助。

https://cn.vuejs.org/v2/guide/index.html

Vue.js 技术揭秘,这份开源教程的目标是全方位地解析 Vue.js 的实现原理,对源码层面有着很深入的剖析。

https://github.com/ustbhuangyi/vue-analysis

Angular 入门教程,这份官方教程会通过构建一个电子商务网站,介绍 Angular 的基本知识。

https://angular.cn/start

React 入门教程,这份教程更适合喜欢边学边做的开发者。

https://zh-hans.reactjs.org/tutorial/tutorial.html

之后,要学习一下 DOM 编程,这个也是前端工程师的核心技能之一,《DOM 编程艺术》这本书是必读的。

还有网络编程,这部分主要学习一下 fetch,websocket,jsonp,cors,formData 这些关键字。

四、中级

初级的目标是写出可以运行的页面,中级的目标是以更快的速度写出体验更好的页面。

如果说数据结构与算法会是初级到高级的第一道门槛,能否写出高内聚、低耦合的代码,则是第二道门槛。

内聚什么?解耦什么?

从变化的角度来说,未来可能变化和不太可能变化的代码需要解耦;对应的原则包括:开放—封闭原则(OCP)、Liskov替换原则(LSP)、依赖倒置原则(DIP)、接口隔离原则(ISP)

从功能的角度来说,不同职能的代码必须解耦;对应的原则包括:单一责任原则(SRP)。

在渲染引擎 webkit 和 v8 引擎出现之后,浏览器的性能得到了很大提升,以至于在多数场景下前端工程师都不会面临的什么性能问题。

这其实是从初级到中级的一道隐形的门槛,很多工作多年,由于工作场景的限制,接触不到什么问题,自己也没主动学习,导致在性能优化维度一片空白。

《高性能javascript》依然是这个领域的经典,第五章字符串和数组相关操作、第九章构建部分、第十章工具这部分可以忽略。

前端页面的极致用户体验主要围绕着:加载体验、渲染体验、操作体验这三方面。千万不可以只知道优化加载体验,5G时代即将来临,网络速度会得到进一步提升,但CPU处理速度,貌似还没看到突破性进展,未来的用户体验问题,会更加聚焦到渲染体验和操作体验。

前端项目同样面临着软件生命周期的各个环节:

  • 代码管理必须要学会使用 Git
  • 代码构建要学会使用 webpack

五、高级

从初级到中级,可以根据教程来快速达到目的,但进入高级后,就只能靠你自己了。这里提供一个前端的知识结构:

https://github.com/JacksonTian/fks

里面的内容就需要你自己去花时间花精力好好消化一下了。

参考链接:https://www.zhihu.com/question/19834302

没有什么使我停留——除了目的,纵然岸旁有玫瑰、有绿荫、有宁静的港湾,我是不系之舟

0 人点赞