老實說，前端經(jīng)過這幾年的快速發(fā)展，網(wǎng)上的文章和教程還是蠻多的，有經(jīng)驗的人能夠根據(jù)資料制定出屬于自己的學習方法和路徑，但對于小白來說，還是有些難度。知了姐來給大家分享前端學習路徑。針對0基礎，非科班，沒有編程經(jīng)驗，想學前端，但是不知道如何入門的人群。

基礎部分：

1、HTML + CSS 這部分學習，可以模仿一些網(wǎng)站做些頁面，在實踐中積累經(jīng)驗。做到能與UI對接，能100%重構(gòu)網(wǎng)站靜態(tài)頁面的開發(fā)，為后期編寫頁面邏輯、動態(tài)效果打基礎。

2、Javascript 要學的內(nèi)容實在很多，如果沒有其他編程語言的基礎的話，學起來可能要費些力，這個階段需要掌握編程基礎概念，培養(yǎng)邏輯思維能力。能夠獨立完成網(wǎng)站的頁面開發(fā)（包括合理布局，JavaScript操作DOM）

進階部分：

有了以上基礎，就可以進行一般的靜態(tài)網(wǎng)頁設計，不過對于復雜的頁面還需要進一步學習。

3、JavaScript高級與服務器基礎，深入面向?qū)ο缶幊蹋邆湟苿佣碎_發(fā)能力，處理瀏覽兼容問題，深入學習ES6/ES7語法規(guī)范，前后端分離開發(fā)思想。

4、框架與服務器，數(shù)據(jù)庫，前端安全的學習，深入了解Node，數(shù)據(jù)庫操作，前后端分離技術，前后臺協(xié)作開發(fā)。熟悉NPM（Yarn），Node模塊fs，http，路由，處理請求，express4（koa）；掌握創(chuàng)建websocket服務，MongoDB/MySQL數(shù)據(jù)庫CRUD（Mongoose）；掌握微信小程序開發(fā)，掌握基礎，Vue-router，Vuex等等。

5、React與組件化開發(fā)，深入學習組件化開發(fā)思想，了解webpack使用，掌握React開發(fā)基礎，Hook，create-react-app等等。

升級部分：

有了以上知識，對于大多數(shù)小型網(wǎng)站，你應該已經(jīng)可以寫出能夠工作的代碼了。但要想成為更專業(yè)的前端，你還需繼續(xù)努力。更高的要求大概還有四方面：1）易維護，2）可測試，3）高性能，4）低流量（移動端）。

其他補充部分：

前端項目同樣面臨軟件生命周期的各個環(huán)節(jié)，首先是代碼管理，你必須學會使用Svn和Git。其次是代碼的構(gòu)建，如今前端代碼構(gòu)建已經(jīng)不是簡單的壓縮一下了，需要進行依賴管理、模塊合并、各種編譯，比需要學會使用Grunt、Gulp等前端構(gòu)建工具。

以上內(nèi)容只是簡單說了前端學習的順序。對于前端開發(fā)，基本內(nèi)容就這些了，可以根據(jù)自己的興趣愛好選擇性學習以下內(nèi)容。

1、交互設計。大公司依然有專業(yè)人士搞這些，不過不懂交互的前端一定不是好前端。推薦《簡約至上》。

2、后端。應該說前端工程師必須至少了解一門后端語言，不過如果愛好也可深入學習，如今NodeJs在大公司已經(jīng)得到普遍的使用，推薦大家使用在Node上使用Express框架做一些后端服務的開發(fā)。

最后，有經(jīng)驗的程序員都知道，學習編程最有效率的方式就是把你扔到一個項目組，連滾帶爬的做一兩個項目下來你馬上會發(fā)現(xiàn)所有的知識點全都連到一起了，不再是分散的，而是形成一個整體了。那種感覺是僅僅深入鉆研知識點而不寫真實項目的人所不能體會的。 一個項目就是一根繩子可以把大片的知識串到一起。

如果想鍛煉實際開發(fā)的能力而不僅僅是背誦或者了解一些知識點，如果想成為真正的好手，那么，還是做項目吧！

整體來看的話，Web前端開發(fā)需要學習的內(nèi)容還是比較多的。前端是一門涵蓋面很廣的學科，而且技術更新較快，優(yōu)秀的Web前端開發(fā)工程師應該具備快速學習能力。如果沒有快速學習能力，就跟不上Web發(fā)展的步伐，所以需要不斷提升自己，不斷學習新技術、新模式。