仔細思考了一下如何回答好這個話題，其實前端是一個涵蓋面非常之廣泛的一個職位，所需知識體系非常龐雜，與傳統語言“想要精一行，必先通一門” 有很大差別， 前端是”想要精一行，必先通十行”。
下面我用一張圖來展示一下前端的知識體系:
圖片源自於網路，侵刪。
這裡面每一個logo都是前端在某些場景下可能用到，或者必須用到的知識體系，可以用駁雜來形容，而且前端的生態及體系還在不斷的擴張之中。
當然你可以跟著潮流去學習，比如現在主流的三大框架 VUE，REACT，ANGULA，我同樣見過很多半路出家的前端，入門開始便開始使用VUE進行業務開發，但是這樣的前端工程師在成長的路上會受到非常多的阻礙和限制，在職業發展之中瓶頸期往往在一年左右就會到達，會存在無數個為什麼，怎麼解決，怎麼辦，同時在這個過程之中不斷完善自己的技術棧，在痛苦和阻力中學習，稍有不慎便墜入萬丈深淵，不是把自己的心態學習到爆炸就是抱著上墳一樣的心情去面對每天無法解決的問題上班，所以針對於這個問題，前端的體系我感覺非常的重要，也可以說是前端的重中之重。如何做一個底層紮實的前端，不畏懼任何技術迭代，可以笑對日漸繁榮的前端行業，“地基”顯得尤為重要。
基礎篇 : HTML,CSS
1. 影片學習
這種基礎課程可以說非常的多，在網上跟著影片學習，短時間之內就可以實現一些非常cool的效果，但是請注意，如何才能有效的學習那? 如何在數量龐大的影片中選擇我們最需要的內容那? 這可能是我們需要關注的 :
影片網站 ： 推薦慕課網
可以找到一些非常不錯的免費影片，透過一個體系的學習對內容有一個初步的瞭解，但是這類課程有一個問題，就是很多都是華而不實的，為了保證吸引力而存在的影片，不否認有真東西，但是學習效果和知識體系還需要根據MDN，或者W3SCHOOL這列的文件說明類網站去補充，完善。
在這裡補充一個小竅門，在神奇的某寶購買一些培訓機構的隨堂影片，這種影片是機構上課時候發給學生的，被很多商家收集起來，價格極其便宜，比較適合學生黨購入，這些影片之中的乾貨可以說還是有一些的，目前行業之中比較推薦的是千鋒H5的影片，乾貨比較多,體系非常完整。
2. 讀書
枯燥乏味的書我們們在此就不推薦了，這裡就推薦一本非常有意思的讓人眼前一亮且有收穫的書，張鑫旭的<>，好看且乾貨滿滿。
進階篇 : javascript
也就是傳說中的JS，這個不多說，推薦一本書<>第三版，這個毫無爭議前端必學的東西，學了他之後提升飛速。
學習了這些可以說已經開啟了你前端世界的大門，接下來的學習選擇性很大，涉及的內容大體是webpack，gulp，工程化等一系列的內容，推薦找一個靠譜的在職人員給予適當的建議和推薦。
本文轉自知乎：