前端開發該如何循序漸進地學習？對於html、css、js、jq等有哪些不錯的資料 （視頻，博客，書籍等）可以推薦？

可以推薦一些中高級的前端開發資料，我自己寫過博客，已經在運營，有前後台的開發經驗。

---

這樣的問題，我覺得G爸能更好的回答你吧。

---

Javascript核心概念視頻合集 - IT浪人

---

以下是兩個非常著名的在線網路技術入門網站：

w3school 在線教程

Learn to code

我也是最近開始自學的，這兩個網站對我幫助很大，希望也能幫助到你。

---

跟著大牛的腳步，多看看相應的博客，可以看看我收集的：
精彩博客集合 · Issue #2 · hacke2/hacke2.github.io · GitHub

布穀技術月刊 https://sm-fe.github.io/month/

---

很簡單先學好HTML布局跟CSS

理由是很多效果可以由透過它們結合解決，

很多人動不動就寫javascript,

結果弄得整個頁面全是script

然後就再始學習及使用優秀的框架，比如Boostrap...從中你可以看到專家們如何巧妙的解決布局的問題

最後才學javascript, 可以去codeacademy等學習網站去學， 基本上弄明白prototype的概念以及一些主要的設計模式 如module pattern等…

最後才學或者說用Jquery, 因為一早就使用Jquery很常情況下， 大多數學習者對js會變得一知半解，也會對Jquey生出一份依賴，JQuey很好用卻令初學者忽略一些他們本來要知的技巧

最後恭喜你走到這一步可以學習node. js開始學習用js寫後台，當然你也應該有足夠的水平學習angular / backbone / react等前台mvc框架

學習的過程要不斷練習，最好的方法就是定下一個目標邊寫邊學習，比如說自己嚐試把學到的寫一個知乎…

---

自薦我的博客：Blog

上面記錄了一年前端學習的成果，可以當做參考

另外，有些書籍可以推薦：

# 前端書籍整理

書不在多，而在精。推薦書籍以後會不斷更新。

## 入門

### HTML

[Head First HTML與CSS(第2版)](Head First HTML與CSS（第2版）)

### CSS

[CSS權威指南(第3版)](CSS權威指南（第三版） (豆瓣))

### JavaScript

[JavaScript DOM編程藝術(第2版)](JavaScript DOM編程藝術 （第2版）)

[JavaScript高級程序設計(第3版)](JavaScript高級程序設計（第3版） (豆瓣))

## 進階

### HTML5

[HTML5權威指南](HTML5權威指南 (豆瓣))

### CSS

[精通CSS(第2版)](精通CSS（第2版） (豆瓣))

[CSS禪意花園](CSS禪意花園 (豆瓣))

[超越CSS](超越CSS (豆瓣))

[CSS Secrets(中文版)](CSS揭秘 (豆瓣))

### Javascript

[JavaScript權威指南(第5版)](JavaScript權威指南 (豆瓣))

[JavaScript語言精粹](JavaScript語言精粹 (豆瓣))

[JavaScript設計模式](JavaScript設計模式 (豆瓣))

[高性能JavaScript](高性能JavaScript (豆瓣))

[編寫可維護的JavaScript](編寫可維護的JavaScript (豆瓣))

### Node.js

[Node.js開發指南](Node.js開發指南 (豆瓣))

[Node.js實戰](Node.js實戰 (豆瓣))

[深入淺出Node.js](深入淺出Node.js (豆瓣))

### JQuery

[鋒利的jQuery](鋒利的jQuery (豆瓣))

[jQuery權威指南(第2版)](jQuery權威指南(第2版) (豆瓣))

### Bootstrap

[深入理解Bootstrap](深入理解Bootstrap (豆瓣))

[Bootstrap實戰](Bootstrap實戰 (豆瓣))

### AngularJs

[用AngularJS開發下一代Web應用](用AngularJS開發下一代Web應用 (豆瓣))

[AngularJS權威教程](AngularJS權威教程 (豆瓣))

### React

[React 引領未來的用戶界面開發框架](React (豆瓣))

[React Native入門與實戰](React Native入門與實戰)

### 性能實踐

[高性能網站建設指南](高性能網站建設指南（第二版） (豆瓣))

[高性能網站建設進階指南](高性能網站建設進階指南（第二版） (豆瓣))

[Web性能實踐日誌](web性能實踐日誌 (豆瓣))

[Web性能權威指南](Web性能權威指南)

### HTTP

[HTTP權威指南](HTTP權威指南 (豆瓣))

[圖解HTTP](圖解HTTP (豆瓣))

### 版本控制工具

[Pro Git](Pro Git (豆瓣))

[Git版本控制管理](Git版本控制管理 (豆瓣))

[GitHub入門與實踐](GitHub入門與實踐 (豆瓣))

---

直接看codecademy上面的教程，比國內推薦的一些書管用

---

我要安利一個兩年前開始用的自學網站，慕課網，越做越好了，比如我現在在試著往更專業的全棧發展，就選擇了，前端工程師和後端工程師的Path，其中也有關於Ps等設計軟體的教學，但相對較少，因為是計算機出身，本身也有一定建站基礎。看上面的課程的難度都十分適合我，很少有看不懂的地方。如果長期堅持下來，很期待自己真的可以達到一定水平。但是項目積累才是進步最大的途徑。

其次的，遇到問題果斷翻牆問Stakeoverflow，幾分鐘就有人回復。還有就是，如果能找到一個跟你目標相近的團體一起學，互相督促分享資源和經歷進步也許會更大：）。

---

推薦個編程學習網站給你吧，你可以看看有沒合適的，希望也能幫助到你。

wed開發入門_wed前端開發_wed開發技術。

---

同求啊 js比較重要

---

推薦閱讀：