前端入門學習查了好多資料，還是不很清楚，真心想學習，求高手帶一下入門或者指點系統學習路線？

01-29

查看了很多類似問題，還是有點理不清，希望有高手指點下系統的學習方法或者能帶一下入門，不會佔用您太多時間，真心希望引一下路，謝謝了。

謝題主邀。

作為一個開發經驗不滿一年的前端工程師，可以說我並沒有什麼資格給你提建議，也不能給你太多的幫助，畢竟我知道的也少，需要學的東西也很多，能幫你的只有分享一下我學習前端的過程，希望能給題主以及其他正在學習前端的同學一點幫助。

先來說一下我是怎麼接觸前端的吧。

大一暑假在一家做手游的公司實習，做 UI 設計，也算是跟前端沾邊了，那個時候就對前端有一些初步的了解，但是並沒有深入的去學習。由於學校教學的東西很多都是相對來說比較古老的技術，所以在後面很長一段時間我對前端也僅僅是關注但並沒有花時間去學習，一直到大三下學期，有幸有機會被老師介紹到國家某研究所做實習生，在做 Java Web 開發的時候，有項目需要用 nodejs ，所以就開始學習 NodeJS、JavaScript，至此開始了我的前端開發之路。

如何學習？

知識點

無非就是 html css js 所有東西都是圍繞它們來展開的。

路線？

先把上面三個學會了再說吧。學會基礎之前路線並沒有什麼卵用。

怎麼學？看視屏、教程、看書

如果你是剛剛接觸前端，對前端技術一點都不了解，那麼，最快的學習方式就是看視屏。像慕課網、極客學院、騰訊課堂之類的，通過視屏學習可以快速對前端的基礎技術有一個大概的了解，方便快速上手。

對前端技術有一些了解後，視屏就不那麼重要了，重要的是什麼？練習！你看了視屏就記住了么？我相信每個人都一樣，光說不練假把式，所以在對基礎的技術有了大概的了解之後，不要怕敲壞你的鍵盤，趕緊找一些實例教程，哪怕是一個字一個字照著教程敲，也比你兩隻眼睛看要強的多。多練，多積累經驗最重要，經驗是你在視屏和書本中學不到的東西。

然後來說一說看書。雖說書上學不到經驗，但是它涉及到的知識點很全面（這裡指的是權威類的書籍，並不是 xxx實戰教程），能幫助你對這門知識有更系統的認識，這很重要！記得前兩天跟一個大牛同事聊天的時候談到了 CSS ，他的一句話我很贊同：「99%的前端都會寫 CSS，但是都沒有系統的學習過 CSS，為什麼他們會覺得 CSS 不好寫？因為它們都沒有系統的學習。」相信很多前端開發者都遇到過寫CSS 的時候遇到莫名其妙的問題，如果系統的學習了 CSS ，那你根本不會有這些困惑。所以在有一定的基礎之後，你需要做的是繼續做項目積累經驗，並重新系統的學習相關知識。

上面做完了該幹嘛？

學框架吧，主流框架很多，推薦 react ,vue，相信我，你會愛上它們的。

然後呢？學會記錄很重要。

我們肯定都遇到過這樣的情況：哎，這個我記得，我看過，但是我忘了怎麼用，忘了怎麼寫。古人說得好：」溫故而知新「。你學過的、看多的，並不代表你會用，況且我相信你也不會有過目不忘的能力。那你要做的是什麼？記錄。記錄很重要，但也不是什麼都要記錄。我有一個同學前段時間要跟我學前端，我給了她一些建議，讓她照著做。可是又一次我發現他拿了一個很大的本子，把所有的知識點，重要的不重要的全都抄了下來，像高中時候的學習筆記一樣，我當時就蒙了，我很難想得通她這樣做對學技術有什麼幫助。難道你寫代碼的時候還拿個本子一頁一頁去翻？記錄，並不是要你把所有的東西都記下來，一些簡單的東西基本上可以說是過目不忘，比如說 var，你會忘掉么？我們需要記錄的是你在學習過程中你覺得比較重要的，以及你花很長時間去理解的某個知識點，你需要把知識點和你自己的理解、如何去思考的一起寫下來，養成這個習慣，對你以後的學習、工作都會有很多的幫助，你可以很輕鬆的回顧曾經學過的重點難點還不用花很長時間。

如何記錄？

記錄的方式有很多種，但是我最不推薦的就是我那個同學的方式，用筆抄下來，費事費時，還不方便查閱。有這麼幾種方式可以供參考：

1、博客，可以是 CSDN 的那種，也可是是自己搭建的個人博客，這樣還可以作為一個項目做一做。

2、在 github 上建一個倉庫，把你每天的學習記錄、心得都寫成 markdown，上傳上去，時間長了也是一個自己的學習教程。

3、有道雲筆記，我以前用的比較多，很多重點和心得都寫在裡面，也方便保存，現在用的不多了。最近開始寫專欄，把項目開發中用到的一些技術通過簡單示例的方式展現出來。

最後，一個前端一定要懂後端。

在我個人看來，後端開發人員可以不懂前端，他們可以只提供介面給你，其他什麼都不管。然而作為一個前端，你必須要懂一點後端，哪怕是一點點。可能會有人反駁我的觀點，但是在實際開發中，一個不懂後端的前端會被增加很多不必要的工作。原本很多可以在後端處理的東西會因為一個不合格的後端導致前端開發人員需要做很多的邏輯處理。如果你對後端有一定的了解，你就有理由去跟他溝通，讓他修改介面，把相應的邏輯放在後端來處理。舉一個很簡單的例子，我做的一個模塊在測試的時候沒有任何問題，上線之後測試那邊說我做的那個模塊頁面不能訪問，後端看了下控制台就說是我前端頁面的原因，真的是么？我再去看看報的錯，原來是線上環境用的是 https 協議，而後端調用我的頁面的時候用的是 http 竟然說是我的問題，我當然不高興了，直接把鍋甩給後端，他也沒話說。本來不是我的鍋，幹嘛要我來背。

一個前端要懂後端，其他語言不說了，Nodejs 學習起來相對Java 來說成本還是很低的，況且現在很多主流框架都是用的 node 作為服務端，所以還是值得學習的。

以上就是我在學習過程中的一些心得體會，由於本人經驗尚淺，沒辦法給題主指點學習，只希望我的學習心得能對題主有幫助。

哦對了，如果有興趣可以關注一下我的微信公眾號以及同名專欄：WeCode365，剛開始記錄，東西不多，但是我會保持至少兩天一次更新的，希望能和題主一起學習進步。

回答過很多類似的問題了。

換個角度來回答。

先從Html和CSS來學習，這部分並不能稱得上是真正的程序員，因為你不需要了解業務邏輯。

再接觸一下框架，重點是學習框架的思路，推薦Bootstrap。

然後是less或者是Sass，推薦Less，不用裝那麼多傻不拉嘰的東西。

做CSS的時候主要就是弄清楚幾個關鍵的概念。或者這麼說，分成布局+樣式兩部分去學習。

布局關鍵的就是要弄明白盒子模型，然後是清除浮動，各種居中對齊和環繞。

樣式主要就是各種練習和兼容。

其他的以後再說~

謝邀，

入門和路線可以參考我在這個問題下的答案：

怎麼學習前端開發？求推薦學習路線？ - 知乎用戶的回答 - 知乎

另外，現在很多人學習前端的功利性太強，學習的時候很浮躁。

入門的時候不要去搞那些看起來高大上又花里胡哨的東西node，angular、vue、react、redux，在你對前端的基礎框架還沒一個完整的認識的時候看這些完全是浪費時間。

基礎知識沒大致掌握的時候，什麼bootstrap，jquery這些基礎庫都不要去看，入門的時候你只需要學會HTML，CSS，BOM、DOM、ECMAScript就夠了，甚至你都可以先不去看ES5，ES6，CSS3里的東西。

等你有個好一點的基礎，看到一個頁面在比較短的時間能寫出來的時候，可以去了解下基本和比較經典的常用庫，比如jquery，underscore這些，它們可以比較大幅度的提高你的效率，同時代碼質量也很不錯，用的時候看看這些庫的源碼是怎麼實現的，結構怎麼組織的，想想如果要自己來實現同樣的功能會怎麼做，遇到看不懂或者模稜兩可的地方還是要回頭去補基礎。

過了這個階段，你已經能開始做些完整的小項目了，跟著項目你會接觸到後端，接觸到更多的庫，也會接觸到一兩種框架，接觸到HTTP，接觸到性能問題，接觸到工程化的問題，你會發現有很多可以學和需要學的東西，到這個時候你差不多也就不會再來問這樣的問題了。

所以還是那句話，基礎很重要，入門階段專心把基礎的東西學好，知識脈絡搞清楚，別花時間和無用功去搞花里胡哨的東西。