在 web 开发领域,前后端分离越来越普遍,前后端之间的技术壁垒也随着提高。混合开发的年代,后端多多少少都要会写一些前端的代码,而现在后端已经越来越无法写前端的代码,如果后端想学习前端技术,该如何入手呢?接下来讲讲我的一些经验。
打破思想障碍
前端的发展十分迅速,且生态和标准十分割裂,这对专业的前端也是一个比较大的挑战,对于后端而言难度就更可想而知了。
幸运的是,我们如果只是想做前端入门并且能够开发一些普通的项目的为目标的话还是没有这么大的阻碍的。我们可以花费 20 % 的学习时间解决,80 % 的前端开发问题。剩下的 20% 开发问题,你可以有两个选择:
-
交给专业的前端去做
-
继续精进前端技术,自己解决
确定学习目标
学习前端主要有以下几个部分:
-
CSS
-
JS 框架 (VUE ,React, angular)
CSS
CSS 部分是前端很重要的一个部分,也是大多数后端都不是很擅长的部分,关于 CSS 部分,我们可以借助 UI 框架去解决问题,UI 框架会封装很多组件,我们只需要用相关组件进行布局即可。
CSS 布局就变得十分的重要了,好在现在前端有了 flex 布局,在兼容性和开发便利性上来说都对程序员十分友好,因此对于 flex 布局这部分应该要重点学习和掌握。
CSS 布局另一个比较重要的就是「定位」,因此「定位」这部分的知识也是需要重点掌握的。
掌握了 flex 和 「定位」两部分知识,基本上绝大多数的布局都没有什么问题了,配合上 UI 框架的加持基本上普通页面的开发就可以完成的七七八八了。
js 框架
一般想学习前端的朋友心中都会有自己想学习的框架了,这里建议挑选你周边前端在使用的一些框架,对于你后续的学习能有一些帮助。
学习方法
关于 CSS 的学习方法,主要是看文档和练习,把布局重点学习即可,下面介绍主要介绍一下 JS 框架的学习方法。
阅读文档
这部分可以根据自身掌握情况有选择的进行,如果你对所选 JS 框架,文档已经通读并且对文档结构有了一个掌握就可以跳过这部分。
文档不需要过于深度的掌握,有些概念不理解也可以跳过,随着后续开发的深入,你慢慢就会对一些难以理解的概念有所顿悟。
但是对于文档的结构需要熟练掌握,要做到你遇到问题你能知道到文档的哪个部分去找就可以了。
抄作业
找一个所选 JS 框架的后台管理系统,跟着管理系统文档框架进行一些管理后台功能的开发。
通过抄一些原本原理后台实现的功能,你会对整个前端代码的目录组织和后端通讯有一个比较完整的认识,同时对于 JS 框架的一些用法也会有更深入的了解。
更新一步
如果你对于管理后台的开发已经迎刃有余,那前端的 JS 框架,以及前后端通讯,还有一些基础的页面布局都有了一个系统的了解。接下来可以尝试写一个 H5 项目,进行一些移动端开发。
H5 开发相对于后台管理开发,会更频繁的利用的页面布局和 CSS 相关的知识,能够在原本掌握的基础之上,更进一步的掌握前端技能。
沉淀能力
在学习的过程中,肯定会遇到各种各样的问题,意识到问题的存在本身就是一个好的开始,你可以通过搜索引擎去查阅相关问题的答案,然后结合自己的理解和思考给自己找到答案。
如果上述方法没有办法找出答案,你可以向周围的前端同学进行请教,在你查阅和思考的过程中,你已经清楚的知道你面临的问题究竟是什么,也可以在向前端同学请教的过程中,言之有物,让前端同学能够更方便和高效的帮你解决疑惑。
在任何时候的学习过程中,都要尽量避免遇到问题不经思考就去问别人的情况发生。因为如果没有自己的思考,你很难精确的描述自己遇到的问题,可能有些问题是很简单的,自己通过搜索引擎就可以解决,而我们如果直接去问别人,除了会浪费很大成本在沟通上(无法精确描述问题,需要不断沟通去确定问题),如果问题是常见问题还会给别人带来不好的印象。
总结
任何行业要做精都是很困难的,我们可能花了 20 % 的时间进行入门,剩余的职业生涯中 80% 的时间去解决那些极少数会遇到的情况。而恰恰是这些极少数发生的问题,才是真正的壁垒所在,那是我们花了无数精力学习沉淀而来。