01.PS切圖

《PhotoShop切圖》

《切圖規范及標注規則記錄》

02.Sublime編輯器安裝及調試

《如何優雅地使用Sublime Text》

《一鍵”生成HTML——Emmet插件常用語法》

《HBuilder 使用教程》

03.html部分

《我的HTML會說話——從實用出發，談談HTML的語義化》

《HTML5 簡介》

《HTML5 中文教程》

《HTML5新標簽學習筆記》

04.CSS部分

《css教程》

《網易微專業之《前端工程師》學習筆記（1）-CSS文本格式》

《網易微專業之《前端工程師》學習筆記（2）-CSS的簡寫和分開寫》

《網易微專業之《前端工程師》學習筆記（3）-CSS盒模型》

《網易微專業之《前端工程師》學習筆記（4）-CSS不常用選擇器》

《網易微專業之《前端工程師》學習筆記（5）-CSS布局屬性》

《網易微專業之《前端工程師》學習筆記（6）-CSS變形》

《網易微專業之《前端工程師》學習筆記（7）-CSS動畫》

《網易微專業之《前端工程師》學習筆記（8）-CSS作業1》

《網易微專業之《前端工程師》學習筆記（8）-CSS作業2》

《談談如何用CSS處理文本格式》

《Flex彈性布局教程：語法篇》

《Flex彈性布局教程：實例篇》

《CSS深入-設置不同塊級流方向時的屬性百分比計算》
《巧用margin/padding的百分比值實現高度自適應(用于占位，避免閃爍)》

05.JavaScript部分

《網易微專業之《前端工程師》學習筆記（9）-JS基礎》

《網易微專業之《前端工程師》學習筆記（10）-JS的常用方法清單》

《網易微專業之《前端工程師》學習筆記（11）-JS正則》

《Javascript進階》

《jQuery》

《網易微專業之《前端工程師》學習筆記（12）-JS單元測試題》

《網易微專業之《前端工程師》學習筆記（13）-JS進階單元作業主觀題》

《網易微專業之《前端工程師》學習筆記（14）-JS期末測試主觀題》

《網易微專業之《前端工程師》學習筆記（15）-JS單元作業題》

《網易微專業之《前端工程師》學習筆記（16）-DOM單元測試客觀題》

《網易微專業之《前端工程師》學習筆記（17）-DOM單元測試主觀題》

《網易微專業之《前端工程師》學習筆記（18）-DOM期末主觀題》

《LocalStorage必知必會》

《html5系列：form 2.0 新結構》

《html5系列：form 2.0 新數據類型》

《html5系列：form 2.0 新表單屬性》

《【JS學習筆記】關于this指針的理解》

《【JS學習筆記】函數表達式中this指針的意外改變》

《【JS學習筆記】ECMAScript中一些最值的考慮》

《javascript中的面向對象之——原型繼承》

《【JS趣味】數組求和的方法收集》

《【JS趣味】去除一個字符串的首字符的方式收集》

《【JS學習筆記】關于如何克隆一個獨立但屬性和方法都相同的對象》

《【JS學習筆記】ES5數組對象的5個迭代方法是如何像它們調用的函數傳參的呢？》

《談談javascript的Function中那些隱藏的屬性/方法：caller/callee/apply/call/bind》

06.頁面架構

《前端布局系列文章》

《水平、垂直居中布局方案整理》

《兩列自適應布局方案整理》

07.前端架構部分

《vue2.0基礎系列》

《vue2.0進階系列》

08.其他

《利用DataURL技術在網頁上顯示圖片》

《Chrome Dev Editor(devaloper preview)》
這是chrome的應用，編輯器，直接在chrome上跑，很多css樣式可以直接通過手動點設置，而不是敲代碼。polymer框架出的應用。

9.作業部分

《網易微專業之《前端工程師》學習筆記（12）-JS單元測試題》

《網易微專業之《前端工程師》學習筆記（13）-JS進階單元作業主觀題》

《網易微專業之《前端工程師》學習筆記（14）-JS期末測試主觀題》

《網易微專業之《前端工程師》學習筆記（15）-JS單元作業題》

《網易微專業之《前端工程師》學習筆記（16）-DOM單元測試客觀題》

《網易微專業之《前端工程師》學習筆記（17）-DOM單元測試主觀題》

《網易微專業之《前端工程師》學習筆記（18）-DOM期末主觀題》

10.推薦書單

《圖解CSS3:核心技術與案例實戰》
《Head First jQuery(中文版)》
《CSS設計指南（第三版）》-人民郵電出版社
《Head First Ajax》
《Head First Html5 programming》
《JavaScript高級程序設計（第三版）》
《單頁Web應用：JavaScript從前端到后端》
《JavaScript語言精粹》
《JavaScriptDOM編程藝術（第2版）》
《編寫可維護的JavaScript》
《Web全棧工程師的自我修養》
《深入淺出Node.js》
《響應式Web設計》
《精通CSS》
《高性能JavaScript》
《You-Dont-Know-JS》

999.安全
《安全之路：Web滲透技術及實戰案例解析（第2版）》by陳小兵

《圖靈程序設計叢書·Web滲透測試：使用KaliLinux》byJoseph Muniz/Aamir Lakhani

《Web滲透技術及實戰案例解析》by陳小兵、范淵、孫立偉

11.推薦資源文章

《玩轉CSS選擇器（一） 之 使用方法介紹》

《玩轉CSS選擇器（二） 之 瀏覽器支持，常見Bug，性能優化》

《IE你夠了！CSS選擇器》

《【CSS學習筆記】對于IE6、IE7下display: inline-block; 的兼容問題的探討》

《使用 CSS3 Flexible Boxes 布局》

《Front-end-Interview-questions》

《CSS 學習指南》

《移動前端開發之viewport的深入理解》

《語種名稱代碼》

《移動端高清、多屏適配方案》

《用 highlight.js 為文章中的代碼添加語法高亮》

問題與對策：CSS的margin塌陷（collapse）

《CSS之BFC詳解》

《詳說 Block Formatting Contexts (塊級格式化上下文)》

《了解服務器的相關知識》

《不只是平面：css三維變換的應用》

《3d transform的坐標空間及位置》

《運算符優先級》

SegmentFault 2015 Top Rank 系列之《JavaScript 相關優秀文章》

SegmentFault 2015 Top Rank 系列之《前端優秀文章》

《Javascript中valueOf與toString區別》

《JS中的prototype》

《CSS Grid布局：瀏覽器開啟CSS Grid Layout》

《CSS Grid布局：什么是網格布局》

《CSS Grid布局：網格單元格布局》

《CSS Grid布局：合并單元格布局》

《CSS Grid布局：顯式和隱式網格線》

《CSS Grid布局：網格區域》

《CSS Grid布局：獨立源與網格的層疊順序》

《CSS Grid布局：網格的流動》

響應式
《移動前端開發之viewport的深入理解》

《谷歌 Web 開發最佳實踐手冊（2.1.1）：標簽中的圖像》

《如何給函數取個合適的名字》

《Cookie有毒？實測告訴你Cookie的真相》

《一個對前端模板技術的全面總結》

接下來的是兩篇GitHub的文章
《如何高效利用GitHub》
《Git與Github入門資料》

《怎么使用GitHub-知乎》Fadeoc Khaos
《Git之忽略文件(ignore file)》

《自定義 Git - Git屬性》

《Git官網講的.gitattribute（英文）》

《Node.js中的模塊接口module.exports淺析》

《關于commonJs和nodeJs的關系》

《Javascript 異步加載詳解》

《JavaScript 依賴管理》

《猴子都能懂的Git教程》

《怎樣有效學習nodejs》

《搭建一個免費的，無限流量的Blog----github Pages和Jekyll入門》

《js的一道經典題》

《一道常被人輕視的前端JS面試題》

簡書著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。1