请问学习前台最有效的办法是什么？

如鱼饮水，冷暖自知。

对别人有效的方法，对你不肯定有效。这个道理你应该在上小学的时候就发现了。

有些答案里说的一两周入门，是可能的。

比方我在彩程的时候一周入门 Rails，两周做出了一个已上线使用的网站。并且还封装了 API 供 iPad 用户端使用。

但这也是由于我有基础呀。我会融会贯通呀。所以假如你没有接触过编程，不要指望几周入门这种事情了。

我在教学过程中发现了一个心理现象，很有意思，那就是：

「已入门者」无法了解「未入门者」的苦恼。

什么意思呢？

「已入门者」在入门的时候，会遇到很多困难，但是一旦他通过搜索、问人、调试甚至碰运气乱写，最终搞懂了之后，他就会觉得：

这很简单嘛！我之前在想些什么啊。

你假如问他，这东西难不难，他一定会说「不难，很简单」，不就是搜一搜网页、写一写代码。而他在期间的种种苦恼，早已烟消云散了。

为什么会这样？也许是虚荣心作怪，也许是大脑对已熟习的事物会做简化解决，我不是心理专业的，具体起因就不得而知了。

我作为一个五年的前台从业人员，其实已经无法了解新人在入门时遇到的障碍了。

为了了解新人，我做了少量事情。

比方我在 2016 年开始学五笔，以体会「新人」的感受。

总结下来就是：

真难啊。

尽管结果是「我学会了」。但是我学得不太爽。

下面是我的学习过程。

首先我动用我十多年来高超的搜索技巧（其实就是搜索了一下知乎），知道五笔分为两个版本。

那么我应该学哪个版本呢？

分析了一下之后选择了新版。

而后开始记字根。

我记忆力还行，一晚上基本把 25 个键位上的一百多个字根背下来了。

而后就开始用。

也就是说我只用了一天就入门了。

但是！

在这之后，我有很多不适的感觉。

首先，我不会拆字，我看到很多拆字的口诀，但是只能猜个大概。

真到自己拆字的时候，老是拆错。

而且搜索如何拆字的时候，有时候会搜到老版的拆法，令我费解。

而后，就是打字很慢。这个是当然的，我只用了一天入门，我一分钟能打10个字我就谢天谢地了！

为理解决这个问题，我想了两个办法：

1. 打印了所有字根放在手边供我快速查阅

2. 开启五笔拼音混合输入

但是也不爽，因为我打拼音比较快，所以用着用着就变成了完全在用拼音，没用五笔。这怎样能学得好呀。

不过假如我坚持一个月不用拼音，应该就能完全学会五笔了吧。

但是！

我坚持不下去呀。

我打字那么慢，万一女神给我发一句「今晚一起看电影吧」，我用五笔几分钟还没回复可怎样是好！

最终，我成了一个半壶水的五笔使用者。

假如你要问我学五笔难不难。

我会说

简单~不就是背字根而后坚持练习嘛。

其实呢

冷暖自知。

故事讲完了，回到正题：

请问学习前台最有效的办法是什么？

我不太确定你说的有效是指「质量高」还是「效率高」。某种程度上，你不可能同时做到「质量高」和「效率高」。（假如你天赋异禀，那还是可能的）

我就当你说的是「效率高」。

你用了一年时间，还不能仿站，显然效率是低的。

假如纯从理论上来说，想要「效率高」是可能的。

准则一：追求学习的性价比

学习性价比 = 你所学到的有用的知识 ➗ 你花费的时间

要想要性价比高，就要做到两点：

1. 尽量学有用的知识，暂时用不到的可以放在后面学。

2. 尽量快，能一下午开完的知识点就坚决不要拖两个下午。

我们来看看前台哪些知识是有用的。而且我们要精简精简再精简，由于我们要追求性价比。

1. 英语

2. HTML + CSS + JS

3. HTTP

4. 浏览器 API

这四个我实在没法再精简了，那这就是我们最需要学的了。

英语怎样学？

由于编程基本就是在写英文单词，什么 if else while for var new this 之类的，好多单词。

HTML 中的 标签的全称是 anchor，很多人忘记，这个 a 好记，忘记全称不要紧。

但有些标签你忘记全称就不好办了，比方

我见过不少人因为不知道这些单词的意思而放弃使用这些标签  – – |||

CSS 里英语就更重要了，比方 transition、transform、translate，你在不理解英语含义的情况下，很难把这些记下来。

对于英语，我的建议是：

a) 电脑装个有道词典，哪里不会点哪里。

b) 抓住一切可以学单词的机会。比方多用英文软件，少用汉化版。比方用英文操作系统，不用中文版。这样你每天都在记单词了。

HTML + CSS + JS 怎样学？

免费教程很多：

HTML 入门

CSS

JavaScript

看完你就入门了。还记得我学五笔的经历吗，你成功的前提是你能「坚持得下去」。

其实现实生活中有很多前台并不怎样会 CSS（我在阿里和腾讯见到过不少这样的前台），所以假如你想更快，CSS 可以囫囵记一下语法，就直接实践吧！实践是处理坑的唯一办法。

HTTP 怎样学？

墙裂推荐《图解HTTP》，但是看书就慢了是不是，怎样办呢？

你还是自己坚持看教程吧，还免费呢：

HTTP

浏览器 API

比较重要的就是 文档对象模型 (DOM) 和 Window（BOM）。假如你想直接学 React / Vue，其实 DOM 都不用看了。

学了上面四个，而后呢？

假如你坚持下来了，即可以按照轮子哥说的做咯，去做出些东西吧！

准则二：尽量学点难学的东西。

有很多新人说，「webpack 好难啊，看不懂」

知道为什么你觉得难么？由于你没见过更难的东西。

你知不知道有两种编辑器分别叫做 vim 和 Emacs。很多极客都在使用这两款编辑器。（我在用 vim）。

去学学这两个货，比 webpack 难学多了。学完他们，回头看 webpack，不跟玩儿似的。

所以，别老是学习少量简单的东西，多挑战难一点的东西。

准则三：你需要导师。

不知道轮子哥有没有受人指导过，反正我在学编程的路上有很多位导师。

导师的作用：

1. 防止你走偏。甚至告诉你捷径。

2. 帮你理清知识脉络。

3. 解答你的疑问，在你有多个方案但是不确定哪个是最好的的时候，教你怎样权衡。

当然，走偏也有走偏的好处，每条路有每条路的风景嘛。但是假如你想要高性价比的话，还是别走偏吧。

我就说到这里了，不然又有人说我打广告咯。

你都看到这儿了，不赞一下？

: )我目前是在职前台开发，假如你现在也想学习前台开发技术，在入门学习前台的过程当中有遇见任何关于学习方法，学习路线，学习效率等方面的问题，你都可以申请加入我的前台学习交流3000人裙：前面：851 中间：231 最后：348。里面聚集了少量正在自学前台的初学者裙文件里面也有我做前台技术这段时间整理的少量前台学习手册，前台面试题，前台开发工具，PDF文档书籍教程，需要的话都可以自行来获取下载。