2016最新前端學習計劃

以下是簡單的使用說明

前端學習路線圖：由前端教學經驗相當豐富的老師梳理而成，知識由淺入深，循序漸進。自學前端，按照這份學習路線圖學習就可以了！

視頻篇：根據學習路線圖搭配了相應的視頻、源碼資源。部分資源還在玩命更新中，請稍安勿躁，靜候更新。

工具篇：精心收集了40多款前端流行框架、開發工具、手冊、插件、模板引擎。市場上常用的、最新的幾乎都在這了！

經驗篇：前端前輩的經驗之談，給你的學習助上一臂之力！

面試篇：前端技術面試題彙總+非技術面試題完美解答。從此不再怕HR的刁難，看過的都說好！

全部資源只贈有緣人，拿走，還不用謝～另外，這份資源會一直更新，需要的同學持續關注吧！

一、前端學習路線圖

二、前端學習路線圖——視頻篇

六大階段	學完後目標	知識點	視頻資源(附筆記+PPT+模板 +源碼)	密碼
準備篇	學習週期：15天學完後目標： 1、熟悉媒體查詢和響應式設計，使得設計有適配不同的移動; 2、熟悉基礎CSS的格式和CSS盒模式; 3、理解網頁間是如何鏈接的、如何設計多列布局，可以處理表單字段和媒體元素; 4、理解如何創建和瀏覽一個基本的網頁。市場價值：熟練掌握之後，可以滿足市場靜態頁面佈局，但是市場就業工資相對較低，還需繼續往下學習。	開發工具的安裝配置的介紹 sublime、webstorm、Visual Studio Code	正在玩命更新中
		HTML 理解如何瀏覽和創建網頁、基本的語法規範、常用標籤及屬性、網頁之間的鏈接與跳轉、標籤節點層級節點	《前端輕鬆入門： HTML超強視頻分享》《前端輕鬆入門： HTML筆記+PPT+源碼》	pt2p bya5
		CSS 基本語法和三種書寫位置、選擇器和格式化排版、盒模型的高級用法、常用佈局模型	《前端輕鬆入門：CSS超強視頻分享》《前端輕鬆入門：CSS筆記+PPT+源碼》《CSS梅蘭商城項目實戰視頻教程傳智出品，無償分享！》《CSS梅蘭商城項目實戰視頻教程—配套資源》	ha3i u7k1 isx8 6scx
		JavaScript入門基礎語法和變量、數據類型和數據類型轉換、條件判斷、循環語句、函數、數組等內置對象	《快速入門JavaScript 三天視頻教程分享》《快速入門JavaScript教程配套筆記+源碼+PPT》	t4bw 3w93
		京東首頁實戰 CSS代碼抽象與複用、浮動的盒子佈局、padding 和 margin 使用、層級的使用、定位特性的各種使用場景	正在玩命更新中
基礎篇	學習週期：20天學完後目標： 1、能夠基於jQuery實現炫酷效果和複雜的功能模塊； 2、能創造或添加自定義效果到網頁上； 3、能熟練添加標準的動畫效果到網頁上； 4、熟練操作DOM模型。市場價值：8-13K	JavaScript基礎 JS語言的基本構成、變量、數據類型、表達式、選擇結構、循環結構、短路語句、函數基礎	《五天Javascript基礎加強視頻分享！》《【前端】Javascript基礎加強配套筆記+源碼+PPT》	98ef p23z
		DOM + BOM DOM基本結構、節點對象的操作、事件特性及使用、常見的內置DOM對象、常見的BOM功能	正在玩命更新中
		網頁特效與進階在網頁特效中常用的編程接口、動畫編程、事件對象和冒泡、緩動框架封裝和旋轉木馬案例、正則表達式及應用	正在玩命更新中
		Jquery 選擇器、基本操作API、動畫API、事件API、插件機制、原理分析、項目實戰	正在玩命更新中
核心篇	學習週期：20天學完後目標： 1、能夠基於jQueryMobile/Zepto等框架進行移動端js功能開發； 2、能夠熟練使用HTML5/CSS3/ canvas進行移動端頁面和功能效果開發，並且能夠基於原生和框架進行響應式效果開發； 3、能夠基於jQuery、bootstrap等框架實現炫酷效果和複雜的功能模塊； 4、能夠獨立製作電商類，企業類網站，以及常見js動態效果。市場價值：13K-18K	Html5 + CSS3 語義化結構、多媒體、本地存儲、其他常見API、CSS3 選擇器、CSS3 邊框、背景、陰影、CSS3 過渡和動畫、CSS3 伸縮佈局、Canvas	《2016年最新H5+CSS3教程視頻》	v53j
		服務端編程端的概念、Web 服務器的概念、服務器搭建、XML與JSON	正在玩命更新中
		PHP PHP基礎語法、PHP服務端編程基礎	正在玩命更新中
		AJAX 基本編程接口、異步數據交互、模板引擎的使用、跨域的實現方案、增量加載	《2016年最新AJAX教程》	hj8n
		移動Web開發響應式佈局、Bootstrap框架深度使用、Zepto.js庫、預編譯CSS	《傳智前端就業班視頻分享：移動web開發課程》《移動web開發課程源碼+筆記+PPT》	n6mi eq37
進階篇	學習週期：15天學完後目標： 1、熟練使用閉包、高級函數、立即執行函數(匿名函數)等； 2、熟練使用元編程，解決Callback等； 3、熟悉JavaScript基本語法。市場價值：18-22K	面向對象在JS中的體現與實踐面向對象理論、對象的基本概念、對象的屬性和方法、通過字面量創建對象	《javaScript高級面向對象-傳智前端就業班視頻免費分享》《javaScript高級面向對象配套源碼+筆記+PPT》	nwu6 8x2y
		開發過程中常用的模式與思想開閉原則、MVC思想、高內聚低耦合、工廠模式	正在玩命更新中
		JavaScript高級特性通過構造函數創建對象、原型對象、繼承的多種實現方式、原型鏈、函數的本質以及 Function 構造函數、作用域鏈、閉包、沙箱模式	正在玩命更新中
		封裝一個自己框架選擇器框架、CSS操作封裝、屬性操作封裝、其他DOM操作的封裝、事件框架的封裝	《傳智前端就業班視頻分享：JavaScript 高級框架設計》《JavaScript 高級框架課程配套筆記+PPT+源碼》	kcv9 8ega
高級篇	學習週期：20天學完後目標： 1、瞭解主流的後臺技術和前後端協作方式，從全局角度理解項目的整個生命週期； 2、熟悉nodejs的全棧式解決方案； 3、從前端的全局角度認識相關的框架； 4、熟練使用VueJS，AngularJS等框架完成複雜的前端功能，熟悉前端工作流。市場價值：22K+	前端工作流自動化流程工具使用、源代碼版本控制工具使用、依賴項管理工具、項目模板腳手架	正在玩命更新中
		流行框架 Angular基本使用、Angular高級特性、VueJS基本入門和路由、項目實戰：豆瓣電影	正在玩命更新中
		模塊化開發模塊化開發規範、常用的模塊化開發工具、RequireJS、AMD/CMD、統一規範UMD、SeaJS	正在玩命更新中
		NodeJS Node介紹、基本操作、常用內置模塊、高級特性、常用框架	正在玩命更新中
移動 APP 開發	學習週期：8天學完後目標： 1、深刻理解移動App的開發模式和技術選型； 2、熟練使用各種模式開發移動應用； 3、瞭解微信企業公共號開發。市場價值：22K+	混合式應用開發混合式平臺架構、混合式開發實踐、京東APP端實戰	正在玩命更新中
		微信開發微信公共號介紹、平臺API對接、X5兼容處理、內置接口	正在玩命更新中
		React 組件化思想、基本使用、核心特性、JSX、TODOMVC案例	正在玩命更新中
		React Native 環境與工具、實現思路、常用組件、常用插件、綜合案例：豆瓣電影	正在玩命更新中
		移動其他APP開發框架 PhoneGap、AppCan、HTML5+、Framework7	正在玩命更新中
		移動其他APP開發框架 PhoneGap、AppCan、HTML5+、Framework7	正在玩命更新中

三、前端學習路線圖——工具篇

前端流行框架	angular	angular-1.5.8離線文檔	http://pan.baidu.com/s/1pLVilLp	rrbv
		angular.js 在線中文文檔：	http://www.angularjsapi.cn/	無
		angular.js官方文檔	https://angular.io/docs/ts/latest/	無
	react	react-15.3.1離線文檔	http://pan.baidu.com/s/1kUKkMTh	2vmp
	react	React 在線文檔	http://reactjs.cn/react/docs/getting-started-zh-CN.html	無
	ionic	ionic-1.x離線文檔：	http://pan.baidu.com/s/1nuFxaWT	3jbd
	ionic	ionic 在線文檔	http://www.ionic.wang/js_doc-index.html	無
	node.js	node.js 官方在線文檔	https://nodejs.org/dist/latest-v6.x/docs/api/	無
	Bootstrap	Bootstrap在線文檔	http://www.bootcss.com/	無
	vue	vue離線文檔：	http://pan.baidu.com/s/1c2LvllQ	xp7e
	vue	vue.js 在線文檔	http://cn.vuejs.org/guide/	無
	以上資源合併下載		https://pan.baidu.com/s/1pLfbxnP	i4mr
前端開發工具	CSS處理工具	less 官方文檔	http://lesscss.cn/#download-options	無
	CSS處理工具	sass 官方文檔	http://www.w3cplus.com/sassguide/	無
	構建工具	GRUNT 官方文檔	http://www.gruntjs.net/getting-started	無
	構建工具	Gulp 官方文檔	http://www.gulpjs.com.cn/docs/getting-started/	無
	字體庫	iconfont	http://www.iconfont.cn/	無
		fontawesome離線文檔	http://pan.baidu.com/s/1slTcqFb	b3im
		fontawesome在線文檔	http://fontawesome.io/	無
	代碼編輯工具	WebStorm 前端開發神器下載	http://pan.baidu.com/s/1dEATsWh	hjak
		Sublime Text 下載+全套快捷鍵	http://pan.baidu.com/s/1eSjxmTk	2yka
		常用編輯器Editplus下載	http://pan.baidu.com/s/1dFidrpR	grnq
		編碼必備：Adobe Dreamweaver CC下載	http://pan.baidu.com/s/1nvLIBbF	z637
		編輯利器：Atom下載	https://pan.baidu.com/s/1i46H2dB	s5ft
		免費編輯器Brackets下載	https://pan.baidu.com/s/1bYGa1g	4152
		編寫代碼利器：Notepad++下載	https://pan.baidu.com/s/1bp9lMyV	83yy
	其它工具	YII框架軟件下載	http://pan.baidu.com/s/1i5Ezk5v	vnef
		數據庫客戶端軟件navicat下載	http://pan.baidu.com/s/1hr91pqc	mnny
		集成環境軟件WampServer下載	http://pan.baidu.com/s/1i5uMxvf	pkkc
		抓包工具Httpwatch下載	https://pan.baidu.com/s/1skFo7sp	kph4
		文件及目錄對比神器Beyond Compare下載	http://pan.baidu.com/s/1eS5bVii	ci6t
		nodejs	http://pan.baidu.com/s/1c2olq84	cfn9
	以上資源合併下載		https://pan.baidu.com/s/1i518nvJ	m4gt
前端手冊	HTML5	html5參考手冊 api 下載	https://pan.baidu.com/s/1jIQ8yBc	ee3z
	CSS	CSS2.0中文參考手冊 api 下載	https://pan.baidu.com/s/1dEJbf8X	u23n
		CSS3.0中文參考手冊 api 下載	https://pan.baidu.com/s/1bLPc7O	hxa3
		css3.4 API 中文樣式表手冊下載	https://pan.baidu.com/s/1jI8r3L0	99ar
		CSS4.0中文參考手冊 api 下載	https://pan.baidu.com/s/1dFsmGUX	xs2y
	JavaScript	JavaScript參考手冊	http://pan.baidu.com/s/1jIqaPVK	4ivy
		javascript權威指南	http://pan.baidu.com/s/1gfx867h	66e7
		JavaScript中文教程	http://pan.baidu.com/s/1jHD1pIm	2fth
		JavaScript中文手冊api下載	https://pan.baidu.com/s/1eSeD0cy	rmhq
	jQuery	jQuery1.11.0_中文	http://pan.baidu.com/s/1qXQMlU8	73rf
	jQuery	jQuery api 1.8 中文（離線）版下載	https://pan.baidu.com/s/1c1WAaYW	i2fm
	Bootstrap	Bootstrap中文api參考手冊	https://pan.baidu.com/s/1cn9hsM	6sd3
		Bootstrap-v3.3.5中文api	http://pan.baidu.com/s/1jHKmPOa	s5hv
		Bootstrap3.2.0中文文檔	http://pan.baidu.com/s/1c155VpQ	igxj
	其它手冊	Zepto中文api參考手冊	https://pan.baidu.com/s/1dFOGHqD	zsic
		AngularJS中文api離線參考手冊	https://pan.baidu.com/s/1i5oaLYt	gd57
		MYSQL手冊	https://pan.baidu.com/s/1boFHhwz	7d1k
		DOM手冊	https://pan.baidu.com/s/1qXDUHm0	5s8p
		w3school api文檔下載	https://pan.baidu.com/s/1miuau16	qvqi
		seajs離線文檔	http://pan.baidu.com/s/1hrB31li	aqzn
	以上資源合併下載		https://pan.baidu.com/s/1nuJ0Ivf	hrxv
前端插件	Canvas圖表插件	echarts	http://echarts.baidu.com/index.html	無
模板引擎	underscorejs	underscorejs官方文檔	http://underscorejs.org/	無
	underscorejs	underscorejs中文文檔	http://www.css88.com/doc/underscore/
	artTemplate	artTemplate離線文檔	https://pan.baidu.com/s/1qXHsMGO	baer
	artTemplate	artTemplate官方文檔	https://github.com/aui/artTemplate
	以上資源合併下載		https://pan.baidu.com/s/1dEErv1J	c865

四、前端學習路線圖——經驗篇

前端技術文章（新人篇）	從零基礎到精通的前端學習路線	http://bbs.itheima.com/thread-318332-1-1.html	無
	爲什麼整個互聯網行業都缺前端工程師？	http://bbs.itheima.com/thread-329957-1-1.html	無
	如何成爲一名優秀的前端工程師	http://bbs.itheima.com/thread-329959-1-1.html	無
	前端開發需要學什麼？	http://bbs.itheima.com/thread-329958-1-1.html	無
	高效的前端編程入門訓練方法	http://bbs.itheima.com/thread-324088-1-1.html	無
	寫給剛入門的前端工程師的前後端交互指南	http://bbs.itheima.com/thread-330979-1-1.html	無
	寫給前端新人：前端開發必會的二十五個知識點	http://bbs.itheima.com/thread-329964-1-1.html	無
	【乾貨】最全面的前端開發指南：HTML、CSS	http://bbs.itheima.com/thread-330971-1-1.html	無
	【乾貨】最全面的前端開發指南：JavaScript	http://bbs.itheima.com/thread-330976-1-1.html	無
	HTML5新手入門指南	http://bbs.itheima.com/thread-330655-1-1.html	無
	HTML5 如何重新定義web	http://bbs.itheima.com/thread-330656-1-1.html	無
	HTML5標籤使用的常見誤區	http://bbs.itheima.com/thread-330652-1-1.html	無
	20 個重要的 HTML5 面試題及答案	http://bbs.itheima.com/thread-330969-1-1.html	無
	css工作中常用的效果總結	http://bbs.itheima.com/thread-330963-1-1.html	無
	CSS編碼規範	http://bbs.itheima.com/thread-330644-1-1.html	無
	20個很有用的CSS技巧	http://bbs.itheima.com/thread-330983-1-1.html	無
	流行的CSS思想之——淺析OOCSS必須看這個貼	http://bbs.itheima.com/thread-329965-1-1.html	無
	41個Web開發者必須收藏的JavaScript實用技巧	http://bbs.itheima.com/thread-330982-1-1.html	無
	10+ 實用的 JavaScript 調試小技巧	http://bbs.itheima.com/thread-330977-1-1.html	無
	新人拒繞暈： JS中toFixed四捨五入的坑	http://bbs.itheima.com/thread-329961-1-1.html	無
	流行的CSS思想之——淺析OOCSS必須看這個貼	http://bbs.itheima.com/thread-329965-1-1.html	無
	8種CSS樣式使用技巧	http://bbs.itheima.com/thread-332570-1-1.html	無
	如何寫出小而清晰的函數	http://bbs.itheima.com/thread-332579-1-1.html	無
	Web前端有哪些職位？	http://bbs.itheima.com/thread-332574-1-1.html	無
	CSS消失的邊界問題	http://bbs.itheima.com/thread-332606-1-1.html	無
	網頁前端學習總結（一）	http://bbs.itheima.com/thread-332609-1-1.html	無
	網頁前端學習總結（二）	http://bbs.itheima.com/thread-332612-1-1.html	無
	以上資源合併下載	http://pan.baidu.com/s/1slcVfvJ	gjqg
前端技術文章（經驗篇）	【前端技術分享】Web前端性能優化的9大問題	http://bbs.itheima.com/thread-329968-1-1.html	無
	JavaScript學習筆記之判斷語句的使用	http://bbs.itheima.com/thread-329969-1-1.html	無
	Nodejs --- 丟掉flash，兼容IE789的進度	http://bbs.itheima.com/thread-329970-1-1.html	無
	如何實現點對點隨機匹配聊天	http://bbs.itheima.com/thread-329972-1-1.html	無
	一看就懂的ReactJs入門教程	http://bbs.itheima.com/thread-329973-1-1.html	無
	談一談循環的性能提升	http://bbs.itheima.com/thread-329975-1-1.html	無
	超強的JS總結（一）	http://bbs.itheima.com/thread-329984-1-1.html	無
	zepto和jquery的區別，zepto的不同使用小結	http://bbs.itheima.com/thread-330314-1-1.html	無
	CSS3圖片倒影技術	http://bbs.itheima.com/thread-330315-1-1.html	無
	HTML5標籤使用的常見誤區	http://bbs.itheima.com/thread-330316-1-1.html	無
	JavaScript中的數據類型判斷	http://bbs.itheima.com/thread-330495-1-1.html	無
	web前端35個jQuery小技巧！	http://bbs.itheima.com/thread-330632-1-1.html	無
	前端性能之----減少DNS查詢次數	http://bbs.itheima.com/thread-330913-1-1.html	無
	vue中引入swiper關鍵問題解決	http://bbs.itheima.com/thread-330915-1-1.html	無
	理解ionic2 + angular2開發方案	http://bbs.itheima.com/thread-330931-1-1.html	無
	Ajax同步與異步優缺點與使用	http://bbs.itheima.com/thread-330938-1-1.html	無
	Bootstrap滾動監控器的設計	http://bbs.itheima.com/thread-330645-1-1.html	無
	JS家的十大經典排序算法（上）	http://bbs.itheima.com/thread-331275-1-1.html	無
	JS家的十大經典排序算法（下）	http://bbs.itheima.com/thread-331290-1-1.html	無
	詳解JavaScript存儲	http://bbs.itheima.com/thread-332646-1-1.html	無
	有趣的CSS題目（2）：從條紋邊框的實現談盒子模型	http://bbs.itheima.com/thread-332647-1-1.html	無
	以上資源合併下載	http://pan.baidu.com/s/1slpMuBz	e56b

五、前端學習路線圖——面試篇

前端面試寶典	技術篇	大牛教你如何寫出優秀的前端工程師簡歷	http://bbs.itheima.com/thread-318331-1-1.html	無
		近期整理前端面試題，供大家參考	http://bbs.itheima.com/thread-330105-1-1.html	無
		前端開發工程師面試題	http://bbs.itheima.com/thread-330106-1-1.html	無
		百度2016校招筆試題（含答案、解析）	http://bbs.itheima.com/thread-330107-1-1.html	無
		前端面試常見問答	http://bbs.itheima.com/thread-330633-1-1.html	無
		超實用的前端面試題	http://bbs.itheima.com/thread-330627-1-1.html	無
	薪資篇	面試官如何評判應聘者的工資	http://bbs.itheima.com/thread-330108-1-1.html	無
		當HR問“你對薪資有什麼要求”時怎麼回答
		HR指責要薪太高怎麼辦？
	自我介紹篇	如何進行自我介紹？	http://bbs.itheima.com/thread-330109-1-1.html	無
		“你有什麼優劣勢？”
		“你爲什麼選擇我們公司？”
	項目篇	如何介紹簡歷中的項目？	http://bbs.itheima.com/thread-330110-1-1.html	無
		HR貶低項目時你該怎麼辦“
		項目經驗少該怎麼辦？
	學歷年齡篇	你學歷低，爲什麼要錄用你？	http://bbs.itheima.com/thread-330111-1-1.html	無
		你是不是年齡太大了？
		你太小了，你能承擔項目嗎？
	規劃篇	你準備在我們這家單位做多久？	http://bbs.itheima.com/thread-330112-1-1.html	無
		未來五年的規劃是怎樣的？
	以上資源合併下載		https://pan.baidu.com/s/1geXjXvl	byn6