本科生如何系统地学习前端开发？

亦凉 2023-02-22 12:15 19阅读 0赞

说一下我个人理解跟建议，仅供参考

第一步，先看一本前端入门的书＋《Javascript权威指南》：前端入门的书随便哪本都行，主要是了解一下前端HTML + CSS + Javascript大致是怎么回事，有个概念，脑海中留个大致轮廓就好，非要推荐的话，可以看看《HTML5权威指南》，Apress的书都还不错。入门之后，啃一下《Javascript权威指南》这本JS中的圣经，传说中的犀牛书。成为一个优秀的前端工程师的充要条件是什么我不知道，但我觉得至少完完整整的啃过一次犀牛书肯定是一个必要条件。这一步完成就算入门了吧。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0JPTTQ4NTQ4MA_size_16_color_FFFFFF_t_70]  
第二步，练习实践打代码：如果有课程大作业的话，可以好好做做不要划水。要是没有的话，可以在Website Templates上找几个模版，自己实现一下它的样式和动效，练一下手。之后可以尝试着去接一些外包做做，或者在老师的实验室、学校的组织社团里做一些这方面的前端coding的工作。总得来说，就是要练手。说实在的，前端很多的工作搬砖性质挺强的，所以无它，唯手熟尔。个人建议，第二步可以在犀牛书看到12章左右的时候，就开始了。这一步走了大半年能算上道了吧。

本次给大家推荐一个免费的学习蔻qun，前面603 中间985最后993，
    里面概括应用网站开发，css，html，JavaScript，jQuery，Vue、Ajax，node，
    angular等。对web前端开发技术感兴趣的同学，
    不管你是小白还是大牛我都欢迎，每天技术分享。

第三步，在实践的过程中学习各类流行的库、框架和工具：打代码的过程中，总会接触到一些库啊，框架啊，工具啊等等，有的是因为突然感觉效率不高，然后自己找了一些用，有的是因为某个项目或者工作里要求使用某些库和框架。在这种时候，建议不要通过书或者视频来学习这些库和框架，而是通过他们的官方文档来进行学习。原因有三点，首先，因为前端的发展很快，紧跟脚步还是满重要的，书和视频这种东西都有滞后性，等好的书和视频都出来了，说不定就已经流行大半年了。其次，就是其实书和视频中所讲的所有内容，其实基本上都能从这些库和框架中的官方文档中找到，所以学会通过文档来学习才是真正一劳永逸的正确姿势。最后，看文档其实是一个使用工具的过程，无论什么语言、框架和库，记住所有细节显然是不太现实的，学会如何快速的利用文档回忆或者查找相关的技术点也是作为一个优秀工程师必备的技能。第三步可以和第二步同时进行。另外建议库和框架有的可以会用就行，不必深究，但是有些优秀的、流行的还是可以好好学一下，深挖一下，比如jQuery，Angular，React，Bootstrap，Pure，Ionic，Framework7等等。这几个都能用得熟练的话，算得上合格了吧。

第四步，学习研究一些优秀库和框架的源码、实现与思想：库和框架说到底都是工具，用多了，作为一个有追求的、好奇的工程师，总归会想研究一下这个工具的源码、实现和其设计思想，在这个过程中，你可以阅读上世界上最优秀的前端程序员写的代码和使用的设计思想，对你自己的姿势水平提升会有很大的帮助。之前在阿里面试的时候，二面的leader建议我如果想看源码的话，可以看看雅虎的YUI，是一个非常学院派的库。当然看看jQuery肯定也没问题，挺好的。但是不建议一下子就看Angular，React这种这么大而全的框架，可以深究一下整体的设计思想和部分部件的源码吧。这一步搞了大半年的话，算得上一个优秀的前端工程师了。

第五步，尝试加入一些开源库和框架的工作：研究多了，总会感觉某些框架或者某些库有些小瑕疵，想自己试试。或者之前自己经常写的一些样式和功能想抽象出来，弄出一个通用的组件和库什么的。这个过程，俗称造轮子。可能不一定造出的轮子比现有的好，但是在这个过程中，你会涨很多姿势水平，而且造着造着，谁不定就能造出一个大家都喜爱用的轮子。达到这一步，我觉得你能算得上一个大牛级别的前端工程师了。

第六步，加入顶级库、框架的核心开发组或者研究、开发语言本身：这一步完全不了解，可以作为一个目标，个人感觉到了这一步，可以算的上前端中的大神了。例如之前在新浪，现在在链家的鸟哥，是PHP的核心开发组成员，这种级别，足以称得上大神。

其他：

1.  构建工具推荐使用grunt＋npm＋bower
2.  编辑器推荐使用sublime，IDE推荐使用webstorm

目前企业招聘前端工程师的基本需求：

1.精通DIV+CSS网页框架布局的HTML代码编写，熟悉W3C标准；

2.使用HTML5/CSS3熟练地进行页面开发；

3.具备良好的前端架构分析能力与设计能力，与开发团队保持良好沟通；

4.精通各主流浏览器（IE6+、Firefox、Chrome、Safari）间的差异性，能快速定位和解决各种兼容难题；

5.熟悉JavaScript、Ajax、Flash、JQuery、ExtJS等各种Web前端开发技术，具备一定的跨浏览器开发经验；

6.熟悉Vue，react

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0JPTTQ4NTQ4MA_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200703135259895.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0JPTTQ4NTQ4MA==,size_16,color_FFFFFF,t_70