20個為前端開發者準備的文件和指南（7）

本文由碼農網 – 唐李川原創翻譯，轉載請看清文末的轉載要求，歡迎參與我們的付費投稿計劃！

在前端開發中這是很常見的事，我們需要學的東西太多，然而我們有沒有那麼多的時間去學習。我收集了另外超過20份的學習資源，互動式的場合，和其它的好東西來供前端學習。

請盡情欣賞我們文件和指南系列的第七部分，並且在欣賞完了之後，不要忘了讓我知道我沒有列出的有用的文件或者指南。

1.Meteor: The Official Guide(Meteor官方指南)

Meteor介紹的連結地址: http://www.geekpark.net/topics/211573

它是由Meteor官方開發者團隊製作的一個站點，它綜述了關於最佳實踐應用開發的意見，旨在給那些準備學習Meteor的JavaScript開發者提供中間橋樑的作用。

2.Gethtml

該站點以網格的格式列出了在W3C和WHATWG說明書裡所有關於HTML元素的元素名和描述。如果你單擊某個元素，它也可以連結到說明書上，顯示該元素是如何被使用的一些程式碼示例。

3. Learn ES2015(學習ES2015)

也許你們和我一樣，厭倦了去檢視那麼多的ES6或者ES2015的資源。也許這一個站點就是讓你省事的地方，它會讓你度過學習ECMAScript 說明書裡所有一切新的知識的時間。

4. Flexbox Froggy

這個網站是不久之前傳開的。如果你還沒有見過，而且希望有一個很愉快的方法來學習flexbox(伸縮佈局盒)的語法，該站點是一個做得很漂亮的小的互動式的遊戲或者叫指南。

5. JavaScript Developer Survey Results(JavaScript開發者調查結果)

Nicolás Bevacqua研究了JavaScript的開發習慣。這似乎是第一個由他負責的而且收到超過5000份調查回饋的調查。

6. Flexbox.help(Flexbox助手)

它是一個簡單的互動式頁面，可以幫助你視覺化flexbox的功能是如何工作的(flex-wrap,flex-direction等等功能)。

7. CDN Comparison(CDN對比)

CDN介紹連結地址: http://baike.sogou.com/v30907.htm?fromTitle=CDN

“該站點收集的資訊可以幫助你更好地為你的內容分發需求找到更好地CDN。”

8. Angular Cheat Sheet(Angular參考手冊)

它有一部分是Angular2的官方文件，是一個可以根據JavaScript,TypeScript,和Dart選項來檢視相關語法的一站式的網站。

Angular2介紹連結地址: https://zhuanlan.zhihu.com/p/20058966

TypeScript介紹的連結地址: http://baike.sogou.com/v70611007.htm?fromTitle=typescript

Dart介紹的連結地址: http://baike.sogou.com/v4886002.htm?fromTitle=dart

9. Promisees

主要是由Nicolás Bevacqua製作的，這回它是一個視覺化的場合，可以幫助你學習JavaScript新的Promise功能。更棒的是，它可以單步除錯視覺化的程式碼元件，並且可以選擇是否把該動態的視覺化效果以GIF格式的圖片儲存。

Promise介紹連結地址: http://blog.csdn.net/larrywangsun/article/details/30730419

10. Filter Blend(混合過濾)

它是一個用來學習CSS的background-blend-mode和filter屬性的互動式地方。

11. Mix-Blend-Mode CSS property test(CSS混合模式屬性測試)

該站點和之前的站點類似，它是一個可以幫助你理解CSS的mix-blend-mode屬性的場合。

12. Regular Expressions 101(正規表示式101)

它是一個小巧的互動式工具，可以幫助你理解正規表示式和視覺化正規表示式。包括一個快速入門部分，對使用的正規表示式的解釋和可以把該正規表示式儲存到一個唯一的URL裡。

13. ServiceWorker Cookbook(ServiceWorker參考書)

ServiceWorker介紹的連結地址: http://www.myext.cn/c/a_14591.html

“它是在當今web應用裡使用service workers的一些實際工作示例的集合。開啟你的開發者工具控制檯檢視獲取到關於service worker正在做的事情的事件和通知資訊。”

14. JavaScripting(JavaScript資源集合)

它是一個可以通過包括動畫、DOM、表單、幫助文件、音訊、視訊等類別來過濾查詢JavaScript庫、框架和外掛的一個網站。

15. HTTP Security Best Practice(HTTP安全最佳實踐)

它是用於構建更加安全的Web效能的集合，內容涵蓋了SSL/TLS，內容安全策略，跨站點指令碼，cookie安全等等。

16. Notes on Using ARIA in HTML(在HTML裡使用ARIA註釋)

“它是開發者一個實用的指南，通過使用確定了使得Web內容和Web應用能夠被殘疾人使用方法的ARIA說明書[WAI-ARIA-1.1]來說明如何在HTML元素裡新增許可權通知。”

Rich Internet Applications的介紹連結地址: http://baike.baidu.com/subview/706341/16719158.htm

WAI-ARIA-1.1的介紹連結地址: http://baike.baidu.com/view/9257446.htm

17. PostCSS.parts(分割槽的PostCSS)

“它是一個可以按照PostCSS產檢目錄搜尋的網站。”如果你還不熟悉圍繞PostCSS成長的社群，該網站或許是你學習PostCSS可用外掛的好地方。

PostCSS介紹連結地址: http://www.oschina.net/translate/introduction-to-postcss

18. What forces layout / reflow

它是Paul Irish做的一個要點總結，列出了當在JavaScript裡使用不同的前端功能時，可能觸發的”佈局顛簸”，該問題是一個常見的效能瓶頸。

Reflow or layout thrashing介紹的連結地址: http://www.cnblogs.com/RachelChen/p/5456198.html

19. CSS Indexes(CSS索引)

“它是一個由CSS說明書定義的術語的列表。”當點選某個術語時，它都會連結到它在CSS說明書裡的位置。

20. What are the best JavaScript IDEs and editors?(最棒的JavaScript IDE和編輯器是什麼?)

這是一個釋出在Slant問答站點上的一個問題，該站點上有很多正反的觀點，並且對許多不同的IDE和文字編輯器都有著使用者評論。

之前的六個帖子回顧：

20個為前端開發者準備的文件和指南（1）

20個為前端開發者準備的文件和指南（2）

20個為前端開發者準備的文件和指南（3）

20個為前端開發者準備的文件和指南（4）

20個為前端開發者準備的文件和指南（5）

20個為前端開發者準備的文件和指南（6）