前端小白该如何学习？前端开发工程师掌握哪些能力，有没有专业培训前端的机构

r囧r小猫 2021-09-02 07:11 340阅读 0赞

前端开发是目前比较火爆的行一之一，很多小白、择业者、大学生都会选择前端开发作为职业生涯的一个规划，近年来前端开发发展前景也是比较不错的，薪资也非常可观，在一线城市高级前端开发月工资也能达到30~50左右，市场是非常乐观的。前端开发学习非常重要，下面一起来看下前端的一些知识介绍。

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lja3RweGNscw_size_16_color_FFFFFF_t_70_pic_center]

于一些没有编程经验的人来说，一开始就学习 web 前端可能会让你觉得比较困难。  
因为你的能力还处在初始阶段，你根本不知道你缺少哪方面的知识。

所以，在正式学习之初，你非常有必要先了解一下前端的能力模型。

前端工程师，都需要掌握哪些能力呢？

简单粗暴点，只需要掌握这张图里的能力就行了。

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lja3RweGNscw_size_16_color_FFFFFF_t_70_pic_center 1]

开个玩笑，新手的话，还是要循序渐进。

LV1：学会制作静态页面（Web + Mobile）

HTML、HTML5：

理解如何浏览和创建网页、基本的语法规范、常用标签及属性、网页之间的链接与跳转、标签节点层级节点。

CSS:

基本语法和三种书写位置、选择器和格式化排版、盒模型的高级用法、常用布局模型  
LV2：学会制作动态页面

JavaScript ：

基础语法和变量、数据类型和数据类型转换、条件判断、循环语句、函数、数组等内置对象

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lja3RweGNscw_size_16_color_FFFFFF_t_70_pic_center 2]

（有了这三个，你基本可以写一些简单的页面了，但是仍然需要学一些经典的库和框架。）

经典库：比如 jQuery,YUI2,YUI3

经典框架：比如 Bootstrap

LV3：前后端分离，打造 Web App

Vue.js/AngularJS2/React

Node.js，使用 Express/Koa 配合 MongoDB/Redis 涉足到后端领域

自动化测试

其他：

熟悉 Git 与 Shell 的使用

学习路径

1.入门 HTML + CSS

这里推荐一本书，Head First HTML与CSS（第2版）。

从原理到方法都介绍得很详细，通俗易懂，活泼有趣。html和css入门力荐。

学完大概 1-2 个周。

2.JavaScript + jQuery

JS：看 w3school 教程，花 2-3 天，但 w3school 教程有点过时，看完只能了解个基础，深入学习的话，推荐看《JavaScript 权威指南》，《JavaScript 高级程序设计》。两部都是大部头。看完还需要在去网上找 ES6 资料学习，推荐 ECMAScript 6入门，深入浅出ES6。

jQuery 的话，去官方文档看即可。

熟练掌握大概需要1个月。

3.Vue.js/Angular 2/React

Vue.js：查看官方中文文档大约需要 3 天左右。Vue 上手容易，但没有其他前端框架使用基础的人只看官方文档难以理解 Vue 高级用法以及在生产环境中的运用。目前 Vue 社区还比较小，除官方文档外难以找到优秀资料。

4.webpack & 测试

webpack 是目前应用最广泛的前端模块管理工具，功能强大。

测试相关的框架多且杂，大多是社区产物，较难系统学习。

以上的这些资源足够你学习几个月的，但它们不会带你走得更远。

但是，如果你已经学了这么多，你已经有足够的能力去继续前端的学习，直到你可以完美胜任一个前端工程师的要求。

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lja3RweGNscw_size_16_color_FFFFFF_t_70_pic_center 3]

最后留一点小的建议

你会经常地遇到 bug 和其它一些问题。这可能会让人沮丧，但你要尽量保持冷静，并系统地去思考。记住实践是解决问题的最佳方法。

我们采集的是石头，但是必须时刻展望未来的大教堂。

持续做一些小改进，慢慢地你就会惊奇地发现你的经验得到了怎么样的发展，你的技能得到了怎样的提升。

大多数人都选择的web前端学习方法：

前端技术每年都会不断更新，自学前端容易学不到最新的前端技术，前端学习建议大家还是要选择培训为好，在前端培训学校，
    往往都是根据前端技术发展，从而更新前端课程，让学员学到最新的前端知识。像爱创课堂，是一家专门做前端教育的培训机构。
    是由前百度前端架构师，张容铭老师亲自带队授课全程面授；授课以实战课程为主，张老师前端技术过人，每年有很多学员过来学习，
    也教会无数名高级前端工程师，在各企业都有就职。近期爱创课堂就是由张容铭老师亲自全面授课的，精品小班，名额有限，视频教程、学习路线、
    前端学习培训，请添加威信：kaixin666haoyun 联系我！现在也有很多人选择学校很茫然，其实可以到实地去体验一下，毕竟适合自己才是最重要的。

前端学习方法很重要，选择适合自己的学习方法，学好前端最重要的培养持续的兴趣,其次就是不断实践，从实践中逐渐练习前端代码等，从而对前端有很好的理解与吸收。如大家对前端还有不了解的问题，可以持续关注我，每天会发一些关于前端相关知识，供大家学习与参考！

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lja3RweGNscw_size_16_color_FFFFFF_t_70_pic_center]: /images/20210813/2cc70196a77644efac4b58315bb1ea4f.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lja3RweGNscw_size_16_color_FFFFFF_t_70_pic_center 1]: /images/20210813/91ba3c2b1ad6407bb8aacd7cc00351f1.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lja3RweGNscw_size_16_color_FFFFFF_t_70_pic_center 2]: /images/20210813/27fa788e12bd46819218eceb1ce32a8c.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lja3RweGNscw_size_16_color_FFFFFF_t_70_pic_center 3]: /images/20210813/13cf0bc3e00b4d33997d4b508b99b06f.png