20個為前端開發者準備的文件和指南(2)
本文由碼農網 – 唐李川原創翻譯,轉載請看清文末的轉載要求,歡迎參與我們的付費投稿計劃!
本週開始,你也許想靜下心來學些什麼新的東西,或者提高一下你在一門特殊計算機語言或者技術的能力。
在四月份,我把a collection of useful docs and guides(一些有用的文件和指南)打包到了一起,那是一個很受歡迎的帖子。自此以後,我又收集了一些。請盡情享受!
1. Adobe Web Platform Team(Adobe Web Platform團隊)
新設計的Adobe Web Platform站點的網頁平臺上有很多新技術的資訊和示例。包括SVG的內容,CSS Regions的內容,Filters的內容,Web Extensions的內容和其他的內容。它們產生的很多新的標準都被Adobe team 新增進了參考手冊裡,因此該站點羅列了一些,你可以通過點選它們連結到參考手冊和程式碼示例。
2. Flexbox Cheatsheet Cheatsheet(Flexbox(伸縮佈局盒)參考手冊)
Joni Trythall的參考手冊是在多個參考手冊基礎上製作的,它可以幫助你理解Flexbox(伸縮佈局盒)。它是一個覆蓋了Flexbox(伸縮佈局盒)不同方面的流程圖決策樹,因此通過掃一眼這個圖你就能得到形象化的一切Flebox的知識。在頁面上可以作為一個PNG格式的圖片或者一個全尺寸的PDF檔案使用。
3. Flexy Boxes(玩轉佈局盒)
它是Flebox(伸縮佈局盒)展示的地方,並且可以生成相應的程式碼。我喜歡這個上面的所有附加的選項。每一個功能的下面都有一個幫助說明,並且你也可以選擇使用RTL編寫模式,生成舊程式碼,同時也可以不用字首來觀察只有標準CSS版本的程式碼。
RTL介紹連結地址: http://baike.sogou.com/v4890574.htm?fromTitle=RTL
4. Grid by Example
它是由Rachel Andrew製作的擁有大量資源的文件,它覆蓋了CSS Grid Layout Module(CSS網格佈局模組)的可用示例。包括很多相關的外部連結,同時羅列了覆蓋了說明書的不同部分,並且有可視的示例。
5. CSS Guidelines(CSS指南)
Harry Roberts製作的,它的目標是“為理性編寫可管理和可擴充套件的CSS程式碼而提供有用的建議和指導”。這裡有適合不同CSS開發者水平的很多內容。
6. Foundation 5 Cheat Sheet
它是隻有一頁(雖然是一個很長的頁)的參考站點,可以快速地檢視到類名在ZURB流行的前端框架的不同部分的使用。我喜歡它在頁面上直接包括示例部分,並且在每個部分旁邊都有必要的預先定義好的類列出來。
7. Cheetyr
“它是一個便利的手冊和快捷方式的集合,可以用來提高設計者和開發者的工作效率。”這個專案還在繼續進行,但是目前該站點包括可以被搜尋到的CSS手冊,Git手冊,Vim手冊,Photoshop手冊,Illustrator手冊和InDesign手冊。
8. keyCod.es
一個簡便快速的手冊,可以幫助你在鍵盤上獲取不同鍵的正確鍵值。如果你在你的指令碼里使用event.keyCode或者event.which來判斷哪個鍵被使用者按了,該手冊遲早會有用的。
9. AngularJS Style Guide(AngularJS樣式指南)
“它的出發點是,通過最佳實踐來為AngularJS開發團隊提供融合性。”它實際上有很多的文件,覆蓋了AngularJS語法超過20個類別。
10. Poor Man’s Styleguide
“它是一個應急式的前端樣式指南,它可以直接被copy(複製),然後貼上到你的CMS專案裡。”它提供了在HTML和Markdown裡的所有不同的元素的程式碼,並且在頁面上有所有樣式的顯示效果。
Markdown介紹連結地址: http://baike.sogou.com/v7868944.htm?fromTitle=markdown
11. Web Fundamentals(Web 基礎)
它是Google(谷歌)開發者的”現代開發的最佳實踐”。它覆蓋了很多不同的領域,包括多策略的佈局、表單,並且它甚至有一部分還盈利了。
12. CSS PRE(CSS 預處理)
一份“一站式的手冊”,它用來對照不同的CSS預處理。它包括了一個部落格部分,一張對照圖表,和一些Less,Sass,和Stylus的轉化工具的集合。
Less介紹的連結地址: http://lesscss.cn/
Sass介紹的連結地址: http://baike.sogou.com/v73912368.htm?fromTitle=SASs
Stylus介紹的連結地址: http://blog.fens.me/nodejs-stylus-css/
13. GitHub Cheat Sheet(GitHub參考手冊)
“它是Git和GitHub非常棒的一些功能的列表”。即使你是一個高階的Git/GitHub使用者,在這裡你也可以清楚地找到一些你之前從沒有看到過的東西。
14. HTML Vocabulary(HTML詞彙表)
在最後收集裡出現的文件和”CSS Vocabulary”類似,這個主要關注HTML的不同部分。
15. iOS Human Interface Guidelines(iOS人機介面指南)
它在iTunes商店裡可以免費使用。它主要是為iOS app開發者服務的,但是在它上面也有一些常用的UI設計原則的討論,這些對web平臺開發者或者設計者來說可能會有些利用價值。遵循設計原則對構建基於web的響應式站點非常有幫助,它可以使你製作的native(本地)app更加可用。
16. HTML5 Cheat Sheet(HTML5參考手冊)
它是設計的很漂亮的HTML5標籤的參考手冊。如果你想有一份方便的影印件,它可以以PNG格式的檔案或者PDF格式的檔案列印出來。
17. jQuery Coding Standards & Best Practices(jQuery編碼標準&最佳實踐)
它是開發者編寫jQuery最佳實踐的集合。你或許不贊同描述的所有東西,但是毫無疑問你會找到一些值得思考的的建議。
18. HTML5 Game Engines(HTML5遊戲引擎)
它真的很棒。它比較了用來創作基於HTML5遊戲的不同庫。每一個條目都提供了大量的說明,花費的成本(如果有的話),過濾的標籤,並且在網頁上甚至還有和Amazon網站類似的使用者星評級和評論。
19. You Might Not Need jQuery(你或許不需要jQuery)
你也許已經看過這個,因為當它問世的那一刻它就相當地受歡迎。它是大量vanilla JavaScript的綜述,相當於多種多樣的jQuery方法。但是在後續文件裡將會有一些有經驗的jQuery開發者作註釋,他們會指出為什麼你不應該那麼快地拋棄jQuery。
Vanilla中文社群連結地址: http://vanillaforums.cn/
20. Airbnb JavaScript Style Guide(Airbnb JavaScript樣式指南)
它是一份由受歡迎的國際酒店的站點開發者製作的樣式指南。你沒必要完全去遵循上面的某些東西,但是像其它的樣式指南一樣,你或許可以挑選出一些內容來應用到你自己的工作中。
總結
如果你為精通前端語言或者技術的某些方面,而編寫了一個工具或者樣式指南,請在評論區分享分享,而且或許在之後的一篇文章裡我將把它新增進去。
譯文連結:http://www.codeceo.com/article/20-docs-guides-for-web-dev-2.html
英文原文:20 More Docs and Guides for Front-End Developers
翻譯作者:碼農網 – 唐李川
[ 轉載必須在正文中標註並保留原文連結、譯文連結和譯者等資訊。]
相關文章
- 為忙碌開發者準備的 Go 語言效能分析、追蹤和可觀測性指南Go
- 提高前端開發者效率的11個必備的網站前端網站
- [譯] 寫給前端開發者的 GraphQL 指南前端
- 前端開發者必備思維前端
- 為初學者準備的 ln 命令教程(5 個示例)
- [譯] 為 JavaScript 程式設計師準備的 Flutter 指南JavaScript程式設計師Flutter
- Sentry 開發者貢獻指南 - 前端(ReactJS生態)前端ReactJS
- Java 開發者 必備的工具 和 框架Java框架
- StarBlog部落格Vue前端開發筆記:(1)準備篇Vue前端筆記
- 前端開發者必備的快取知識總結前端快取
- AI應用開發之路-準備:發起第2個開源小專案 SemanticKernel.DashScopeAI
- 為高效 Ops 和 SRE 團隊準備的 10 個開源 k8s 工具K8S
- Laravel 開發前準備Laravel
- 【metabase • 一】開發準備
- 前端開發-拿到一臺新電腦該準備哪些工作?前端
- 為限制和連續做好準備
- 前端開發者必備的程式碼開源平臺,記得收藏轉發!前端
- 平庸開發者的生存指南
- 前端離線開發指南前端
- IT 從業者必備的20個效率工具,速藏!
- 乾貨 | 作為前端開發者如何邁向獨立開發者前端
- 小程式開發前的準備工作
- libusb開發者指南
- 開發者進階必備的9個Tips & Tricks!
- 從天而降的AI“青雲梯”,開發者們準備好了嗎?AI
- 基於Xml 的IOC 容器-準備文件物件XML物件
- 基於.NetCore開發部落格專案 StarBlog - (2) 環境準備和建立專案NetCore
- 【Django開發】前後端分離美多商城專案第2篇:專案準備【附程式碼文件】Django後端
- 使用 Laravel 開發 API 時的前置準備LaravelAPI
- 食品app開發之前要做的準備工作APP
- 前端開發和後端開發,哪個薪酬更高?前端後端
- Parallels Desktop 20 釋出下載,macOS Sequoia 和 Windows 11 24H2 支援準備就緒ParallelMacWindows
- 2019前端工程師必備前端開發資源必備前端工程師
- 掌握這10個技能,成為高效的Web前端開發者,就是這麼簡單!Web前端
- 專為Python初學者準備的IDE你用過嗎?PythonIDE
- 如何成為一個出色的敏捷開發者?敏捷
- Google開發者大會:為中國開發者和消費者推出新的工具Go
- vue2升級vue3指南(一)—— 環境準備和構建篇Vue
- 元宇宙很好,但VR開發者不準備停留在這裡元宇宙VR