手頭有大量的資源,總是一件很棒的事。
作為一個(gè)碼農(nóng),我們需要專(zhuān)注于功能和最佳實(shí)踐,而不是一遍遍地編寫(xiě)樣板代碼。消除無(wú)用功,投入時(shí)間學(xué)習(xí)使用正確的工具或者懂得使用有用的資源可以極大的幫助我們節(jié)省時(shí)間。
通過(guò)本篇文章,我們將會(huì)了解一些能夠極大的幫助我們提升 WEB
開(kāi)發(fā)技能的 GitHub
庫(kù),這些庫(kù)也會(huì)幫助你編寫(xiě)更好的代碼。
Node.js Best Practices
這個(gè)庫(kù)是一個(gè)很棒的地方,可以讓你隨時(shí)了解 Node
世界,并在使用時(shí)了解最佳實(shí)踐。擁有 40k
Star 和 133 位貢獻(xiàn)者,這個(gè)庫(kù)幾乎每天都有更新。
該庫(kù)對(duì)排名較高 Node.js
的最佳實(shí)踐進(jìn)行了總結(jié)和整理,包括 Node.js + Docker
最佳實(shí)踐。目前擁有超過(guò)80多種最佳實(shí)踐,風(fēng)格指南和結(jié)構(gòu)建議等。
一些常見(jiàn)的最佳做法包括:
- 更好地組織項(xiàng)目
- 錯(cuò)誤處理實(shí)踐
- 代碼風(fēng)格實(shí)踐
- 測(cè)試和整體質(zhì)量實(shí)踐
- 進(jìn)行生產(chǎn)實(shí)踐等等
點(diǎn)擊跳轉(zhuǎn)到倉(cāng)庫(kù)
HTML5 Boilerplate
HTML5 Boilerplate
是一個(gè)專(zhuān)業(yè)的前端模板,用于構(gòu)建快速、健壯和適應(yīng)性強(qiáng)的 Web
應(yīng)用程序或者網(wǎng)站。
該項(xiàng)目是多年迭代開(kāi)發(fā)和社區(qū)知識(shí)的產(chǎn)物。它沒(méi)有強(qiáng)加特定的開(kāi)發(fā)理念或者框架,所以你可按照自己的方式自由地構(gòu)建代碼。
包括像如下的預(yù)定義功能:
- Normalize.css
- jQuery with CDN
- Apache Server Configs
- 有用的
CSS
助手類(lèi) - 默認(rèn)樣式,性能優(yōu)化等
根據(jù)你想要用的內(nèi)容以及使用方法,將所需文件復(fù)制粘貼到你的工程目錄里即可。這樣就為你提供了一個(gè)配置好的模板,從而加快了開(kāi)發(fā)速度。
點(diǎn)擊跳轉(zhuǎn)到倉(cāng)庫(kù)
RealWorld
掌握一個(gè)新框架的核心概念和意識(shí)形態(tài)并不是一件令人沮喪的事情。
如果你沒(méi)有正確理解這個(gè)概念的話(huà),你需要閱讀文檔,運(yùn)行示例代碼,拆解示例應(yīng)用程序并將其重新組合在一起,在本地安裝 CLI
等等,它需要花費(fèi)太多的經(jīng)歷,令人沮喪。
RealWorld
允許你選擇任何前端(React
,Angular2
等)和任何后端(Node
, Django
等),并將它們集成在一起以查看應(yīng)用程序的真實(shí)示例。
由于這些實(shí)現(xiàn)和技術(shù)棧相關(guān),它們顯然不能混用,但它們?nèi)匀蛔裱嗤墓δ芎蚒X規(guī)范。
一些常用集成實(shí)例:
- Angular + ngrx + nx
- ClojureScript + re-frame
- React / MobX
- Go + Gin
- NestJS + TypeORM/Prisma
你可以在倉(cāng)庫(kù)中找到無(wú)窮無(wú)盡的示例。盡情去尋找吧!
點(diǎn)擊跳轉(zhuǎn)到倉(cāng)庫(kù)
You Don't Know JS Yet
這是一系列深入研究 JavaScript
語(yǔ)言核心機(jī)制的書(shū)籍。
所有的書(shū)籍均為免費(fèi),你可以隨時(shí)在線閱讀。
作者建議閱讀的順序?yàn)椋?/p>
- Get Started
- Scope & Closures
- Objects & Classes (還未開(kāi)始)
- Types & Grammar (還未開(kāi)始)
- Sync & Async (還未開(kāi)始)
- ES.Next & Beyond (還未開(kāi)始)
點(diǎn)擊跳轉(zhuǎn)到倉(cāng)庫(kù)
Airbnb JavaScript Guide
這是 Airbnb
提供的非常精確和專(zhuān)業(yè)的風(fēng)格指南。
本指南將通過(guò)深入基礎(chǔ)知識(shí)和代碼片段來(lái)幫助你由深入淺地理解 JavaScript
。
本指南涉及的一些熱門(mén)內(nèi)容如下:
- 箭頭函數(shù)
- 變量提升
- 解構(gòu)
- 注釋
- 性能
- 測(cè)試
點(diǎn)擊跳轉(zhuǎn)到倉(cāng)庫(kù)
Storybook
Storybook
是 UI
組件的開(kāi)發(fā)環(huán)境,它允許你瀏覽組件庫(kù),查看每個(gè)組件的不同狀態(tài),以及交互地開(kāi)發(fā)和測(cè)試組件。
Storybook
在 app
之外運(yùn)行,這允許你獨(dú)立開(kāi)發(fā) UI
組件,提高組件的重用性、測(cè)試性和開(kāi)發(fā)速度。你可以快速構(gòu)建,而不必?fù)?dān)心應(yīng)用程序特定的依賴(lài)關(guān)系。
它附帶了一個(gè) CLI
和一些代碼示例,供你熟悉 Storybook
.
點(diǎn)擊跳轉(zhuǎn)到倉(cāng)庫(kù)
Front-End-Checklist
Front-End-Checklist
是一個(gè)詳盡的列表,列出了在網(wǎng)站或者 HTML
頁(yè)面投入使用前所需要具備或者測(cè)試的所有元素。
它是一個(gè)基于前端 Web
開(kāi)發(fā)的倉(cāng)庫(kù),更關(guān)注性能、安全性和 SEO
等。
Front-End-Checklist
中的所有項(xiàng)目對(duì)于大多數(shù)工程都是必須的,但其中有些元素可以省略。
包括:
- 文檔或者文章
- 在線工具/測(cè)試工具
- 媒體或者視頻內(nèi)容
點(diǎn)擊跳轉(zhuǎn)到倉(cāng)庫(kù)
靈感和資源
這篇文章的令該來(lái)源于 Tech Sapien 和他所有令人驚嘆的工作。庫(kù)中的圖片?? 也是取自同一處。
總結(jié)
上面提到的所有的庫(kù)并不是唯一可用的資源,除此之外我敢肯定還有大量的令人驚嘆的項(xiàng)目。這些是其中一些我覺(jué)得很有用的資源,同時(shí)我自己也經(jīng)常沉浸其中。
不要忘了給這些庫(kù)點(diǎn) Star
。以感謝所有出色的貢獻(xiàn)者,感謝他們?yōu)槲覀儎?chuàng)造了如此有用的資源
英文原文地址:https://dev.to/sayanide/best-github-repos-for-web-developers-9id
如果有翻譯的不對(duì)的地方,請(qǐng)多多指正,希望有所幫助。
教程推薦:《Git教程》