2022web前端如何学

135 阅读5分钟

2022年,大家谈论最多的就是“卷”和“找工作难”,在这里跃码教育给大家分享一下前端怎么学。

1、基础的HTML。作为前端网页的基础,最好了解常用的HTML标签,知道哪些是行内元素,哪些是块元素,这些元素有什么特性。了解HTML中多媒体的使用,图片,音频、视频。最好了解一下前端HTML5语义化,这块有助于搜索引擎的收录,对于需要seo的行业来说很是重要。

2、css和css3。仅仅用HTML写出来的网页不够美观,学好css可以写出更加绚丽的网页。大家在学习css的时候,要重点了解一下定位,盒模型,选择器、伪类这些在面试的过程中经常会用到,很多人往往不注重这些基础知识,导致面试失败。另外,一定要了解一下css3的动画,在这个移动互联网的时代,很多公司有移动web宣传页的需求,能用HTML5+css3写出绚丽的网页,也很受面试官的喜欢。

3、JavaScript。js作为前端开发的重头戏,这个一定要学好。第一、要了解js的基础类型,各种数据类型之间如何转化。第二、要了解变量的作用域,闭包。这些都是易错点,属于高频面试题,也是易错点。第三、面向对象编程。虽然js中一切皆是对象,但是很多人这块总是迷惑。因为这块不仅涉及到变量的作用域,还设计到原型链等一系列知识点,可以说前面几点的大杂烩,只有把前面的基础知识打牢固了才能真的搞明白面向对象编程。第四、es6。这块作为js的扩展,在实际的开发中经常会用到,写项目使用频率相当高。

4、实战练习。现在大家学前端都想着速成,然后找到高薪工作,很少有人注重基础知识的积累和实战练习。然后,进行“海投”,胡乱投递简历。大家往往忽略了一点,刚出来的简历才是最受欢迎的,一旦前期没有找到工作,后面就很难找工作,甚至于面试邀约都没有。所以大家一定要在这个阶段把基础打牢固,再做些前端练习,比如:轮播图、模态框、拖拽这些js基础功能,通过这些练习把js和css糅合起来,达到灵活运用。同时,查漏补缺,巩固好js和css基础。大部人面试挂掉,不是因为实战不行挂掉,而是因为面试的时候基础知识不牢固造成的!

5、数据结构和算法。大多说公司招聘的时候,或多或少的都会考一下算法题,所以大家一定要在算法上下点功夫,这个直接决定了你的薪资待遇水平。作为前端开发人员,算法上的要求不是很高,大家只要熟练这些数据结构算法即可:

  • 数组
  • 队列
  • 链表
  • 递归
  • 常用的排序算法:冒泡排序,插入排序,选择排序、快速排序

6、vue全家桶。vue作为一个渐进式的js框架,入门门槛低,上手容易,深受国内开发者的喜欢。同样因为好招人深受中小公司的喜欢。在学习vue的过程中,我们要遵循vue的最佳实践,了解vue的模板语法,指令,学会使用vue-router、vuex、pinia等相关内容,了解watch和computed之间的差异。了解相关的ui库的使用,例如:element ui、ant design vue,最好有一个从零到一的vue实践开发经验。

跃码教育--vue3+ts企业级项目实战

给大家分享一些我们跃码教育做的公开课

vue3+ts图片轮播​www.bilibili.com/video/BV1mr4y177EQ?spm_id_from=333.999.0.0&vd_source=174c044e83a5a1d9ace3643cefc62203

vue3+ts+setup+axios项目实战_哔哩哔哩_bilibili​www.bilibili.com/video/BV1zt4y1x7JJ?spm_id_from=333.999.0.0

vue2+element快速入门_哔哩哔哩_bilibili​www.bilibili.com/video/BV1eP4y1E7se?spm_id_from=333.999.0.0

7、react。react作为脸书开源的前端的web框架深受国内大厂的喜欢,所以想去大厂的童鞋,一点要把react+ts学好。react的上手难度相对vue要高很多,适合js基础扎实和es6学的比较好的童鞋。在学react之前需要了解一下几点:

  • 函数式编程
  • 函数柯里化
  • 高阶函数

跃码教育--react+ts企业级项目实战

在学习react的过程中,我们了解如何定义组件,jsx模板语法、hook的使用,redux、mobx、react-router等等。但是,react的生态相对vue来说没有那么集中,官方只提供了基本的功能,路由和数据仓库需要自己整合。不过不用担心,我已经替大家整理好了。大家可以关注我讲的公开课。

react18+ts入门到实战_哔哩哔哩_bilibili​www.bilibili.com/video/BV11U4y1y7Hp?spm_id_from=333.999.0.0

react+ts+redux-toolkit快速入门教程_哔哩哔哩_bilibili​www.bilibili.com/video/BV1Y94y1S7QT?spm_id_from=333.999.0.0

mobx6+react18+ts快速入门教程_哔哩哔哩_bilibili​www.bilibili.com/video/BV16r4y137cd?spm_id_from=333.999.0.0

8、了解常用的开源项目,例如:

  • ant design pro,阿里开源的react开源项目
  • vben 基于vue3+ts的开源项目
  • 若依系统 基于vue+element的开源项目

ant design pro精讲课程_哔哩哔哩_bilibili​www.bilibili.com/video/BV1mr4y1r7GV?share_source=copy_web

vben admin项目实战与源码解读_哔哩哔哩_bilibili​www.bilibili.com/video/BV1wS4y1M7rt?spm_id_from=333.999.0.0

以上是由跃码教育为大家分享,想学前端的童鞋可以关注我们:

跃码教育:跃码教育是一家怎样的前端培训机构?