该如何学习前端开发

🛜互联网时代，学习资源泛滥，不管你想学什么，基本上都能找到各种各样的学习资料和学习方式，学习前端开发也不例外，这篇文章主要就是和大家分享一下常见的一些学习资源和学习方式，基本上和其他技能的学习都是大同小异的，大家可以做一个简单的参考。

先简单的说一下我的观点，如果你是一个初学者🙋🏻‍♀️（没有任何编程语言基础），一定要尽可能选择更偏视觉化、形象化的方式学习，至少用视频教程进行学习，如果是有老师当面授课肯定是最好的，然后最好要有练习跟练的那种教程，因为初学者最需要的就是大量的练习，来提高自己对于代码的感觉。有可能的话，最好是可以有✋🏻提问和解决问题的途径，因为初学者是很容易碰到一些奇奇怪怪的问题，如果没办法顺利解决，比较影响学习积极性。

书籍📚

✍🏼 重点：不适合初学者

对于初学者来说（没有任何编程语言基础），我是非常不建议通过看书来学习的。我甚至觉得绝大部分编程语言的入门，都不适合用书籍进行入门。

原因如下：

❌ 大部分编程书籍的知识内容讲解和描述都很生硬，因为看书是需要通过文字去产生画面的，代码本身就是非常抽象的东西，在没有任何知识储备的情况下就很难根据文字描述有准确的认知画面，会给很多初学者造成很严重的认知负担。

❌ 就我看过的前端方便的知识书籍来看，基本上都是说明书式的，也就是章节之间的知识点并不是连贯的，而是跳跃的，知识点的组织逻辑不合理，如果对于有编程语言经验的同学还好，但是对于初学者，是非常致命的，往往在学习过程中，就好像一直无头苍蝇一样乱撞，而且还总会被各种没听过的专业名词给困住，整个学习过程会感觉越来越痛苦。

免费视频资源📀

✍🏼 重点：免费也有好的，但是不多，不过足够入门了

现在互联网上有很多的免费视频学习资源，有一些资源还不错，对于初学者来说比看书的体验是好很多。国内这些资源所在的平台主要是 Bilibili，国外的平台主要是 Youtube。

这两个平台都有很多免费的分享的教程，有一些是线下培训机构制作分享的内容，有一些是一些个人用户制作分享的，不管是HTML、CSS还是JavaScript，都有非常多的免费学习内容。

但是这么多免费的内容，内容质量良莠不齐，需要自己去分辨，一般来说你可以挑播放量高的来学习，相对比较稳妥。不过也要注意，很多免费内容是不少培训机构是作为收费课程的引子，一旦要往深了学，很可能就需要去购买付费的内容了。

不过有一说一，基础的入门，比如HTML和CSS，甚至基本的JavaScript看免费的内容是没问题。但是一旦你想学好，学得深入，学得系统，学得有效率，收费课程确实会比免费课程好很多，收费课程也有很多选择，可以多花点时间了解和对比，看看到底什么是适合自己的，不要一冲动就花了几千上万去买课💰。

线上训练营💻

✍🏼 重点：价格偏高，内容够多，但是课程质量不稳定，性价比偏低，适合没有明确学习目标和方向的同学

线上训练营是是目前国内很多培训机构做的一种大量录播加少量直播的这种在线课程模式，主要针对的是期望从事前端工作的学习用户。大部分内容体量会非常多，价格也相对比较高，一般都是四五千起步。

我自己以前在刚开始学习的时候也买过类似的课程，总的来说是课程大拼盘的感觉，核心的内容质量会相对好一些，然后不那么重要的内容，质量就明显差很多。而且整个学习过程也完全是靠自己驱动，相当于是自己买了一堆良莠不齐的学习资料然后自己闷头学习的感觉。

因为录播课为主，所以好处是时间自由，自己想什么时候学就学，比较适合在职工作，需要在工作之余学习的同学。这些课程主要集中在腾讯课堂和网易云课堂，这两个平台的IT培训基本已经被各种培训机构给占领了。

线下培训班⛺️

✍🏼 重点：价格是真高，但是有学习氛围，有老师指导，如果教学质量够好的话，当然是最好的学习方式

线下培训班是目前各行各业主流的一种高价学习方式，毕竟需要老师现场授课，不过听说现在很多线下培训都开始放录屏了。。

线下培训班主要缺点就是🤦🏻‍♂️贵，一两万都是很正常的起步价了，然后就是需要脱产学习，就是像上学一样周一到周五，大家一起学习，整体的学习氛围会比较好，如果机构比较负责，会配有老师随时现场解决同学的疑问，学习效率和体验相对线上来说是最好的，不过谁让它贵呢，对于很多决心转行想从事于前端工作的同学来说，这肯定是除了贵之外最好的选择。

不过，不管是什么什么培训机构，肯定都有好坏的，如果你决定去线下培训，一定要多去了解下机构的口碑和具体情况，不要盲目相信结构自己的宣传资料，毕竟交了好几万课程费用之后，你想让他退钱就不是那么容易的事了。

线上课程👨🏻‍🏫

✍🏼 重点：课程质量因具体课程和制作者而异，价格几百到上千都有，适合有明确学习目标的学习需求

这里说的线上课程，一般都是在一些课程网站平台上销售的收费课程，这些课程绝大部分都是录播课。这些课程一般都是相对独立，也就是一套课一套课的，你完全可以按需购买进行学习，课程购买之后一般来说都是永久有效的，可以永久学习。

也有些平台按会员制进行打包销售，比如你买了一年会员，一年之内平台上所有课程都可以看，像这种一般来说一年的费用也不便宜，至少也是一两千。会员制的形式的话，会员期到了之后就无法继续学习了，所以不同的模式就是各有利弊。

推荐线上课程平台🥇

大家可以通过这些比较流行的课程平台，找到很多优质的课程资源👇

国内

B站课堂 我的🌟JS课程🌟就在B站课堂上，B站上有很多各个领域的优质课程资源，很多宝藏UP主都在B站课堂上做自己的课程

慕课网 这是各种开发编程相关课程的学习网站，主要就是面对开发者和程序员群体，内容很多，涉及方方面面，前端开发只是其中一小部分

腾讯课堂和网易云课堂 这两个是比较传统的在线课程网站了，依托各自的东家，打造成了综合型的课程平台，但是现在感觉各种机构横行，可自行了解一下

Hahow（台湾） 台湾地区的一个综合型的课程平台，各种课程都有，主要是一些独立课程制作者开发的课程

六角学院（台湾） 台湾地区一个专门做前端开发相关课程的在线平台，不仅仅局限前端技术，和前端相关的设计以及后端技术也有对应的课程，感觉是按照全栈前端开发者的思路做课程设计和开发的

国外（英文）

Udemy 全球最大的在线学习平台，提供各种各样的课程，包括编程、设计、营销等等。它的课程涉及方方面面，主要的课程语言肯定是英文的，前端方面也有非常多的课程，而且它们经常会有促销活动，课程有时候的优惠力度很大

Frontend Masters 一个专注于前端开发的学习平台，它的课程涵盖了各种前端技术，包括HTML、CSS、JavaScript、React等等。很多课程是以讲座的形式呈现的，讲课的很多都是前端领域的技术大牛，我自己去体验过学习过不少内容，唯一的缺点就是感觉很多内容不够系统和完整，更像是一种分享，点到为止，可以作为一种补充学习的途径

eggHead.io 一个专注于Web技术的学习平台，提供短小精悍的视频教程。它的课程内容涵盖了各种前端技术和框架，包括React、Angular、Vue等等。它的课程时长短，适合快速学习和掌握新技能

superhi 一个在线编程学习平台，提供各种各样的课程，包括前端开发、后端开发、设计等等。它的课程内容注重实践和项目，适合想要快速掌握实际技能的学习者。

特别好用的工具 ChatGPT 🐮

一定要学会使用ChatGPT或者类似功能的工具，可以帮你大大提升学习效率，帮你节约很多时间，它就是堪比一个无所不知的助教，一定要用起来！！！

📺 Bilibili版本 -> 推荐一个ChatGPT工具

最后🎏

对于学习，任何好的、适合自己的教程其实对于我们每个人的学习过程是非常有帮助的，会帮你节约大量的时间、大大提高学习效率，提升自己学习过程中的体验，帮助自己行成一个正向的学习状态的循环。希望大家都能找到适合自己的教程，学有所成～