對(duì)于 Web 工程師來說做好和最糟糕的事都是 Web 技術(shù)的日新月異。這也意味著作為一個(gè) Web 開發(fā)者來說一定要不斷的學(xué)習(xí)，適應(yīng)變化。

今天小編列舉出了自己開發(fā)和學(xué)習(xí)過程中遇到的好工具和資源，在這里分享給大家：

JavaScript Libraries

• jQuery：最知名的 JavaScript 庫。

• BackBoneJS：為復(fù)雜 WEB 應(yīng)用程序提供 MVP 結(jié)構(gòu)。

• D3.js：最流行的 Javascript 可視化圖形庫之一。

• React：Facebook 開源的 JavaScript 庫。

• jQuery UI：以 jQuery 為基礎(chǔ)的開源 JavaScript 網(wǎng)頁用戶界面代碼庫。

• jQuery Mobile：jQuery 框架的一個(gè)組件，提供完整統(tǒng)一的移動(dòng) UI 框架。

• Underscore.js：提供了一整套函數(shù)式編程的實(shí)用功能，但是沒有擴(kuò)展任何 JavaScript 內(nèi)置對(duì)象。

• Moment.js：一個(gè)JavaScript 日期處理類庫，用于解析、檢驗(yàn)、操作、以及顯示日期。

• Lodash：一個(gè)具有一致接口、模塊化、高性能等特性的 JavaScript 工具庫。

前端框架

• Bootstrap：著名的快速開發(fā)響應(yīng)式 Web 應(yīng)用程序的前端工具包。

• Foundation：一個(gè)易用、強(qiáng)大而且靈活的前端框架，用于構(gòu)建基于任何設(shè)備上的 Web 應(yīng)用。

• Semantic UI：全語義化的前端界面開發(fā)框架。

• uikit：一款輕量級(jí)開源的前端框架。

數(shù)據(jù)庫

• MySQL：最流行的關(guān)系型數(shù)據(jù)庫管理系統(tǒng)。

• MariaDB：由 MySQL 早期員工開發(fā)，屬于 MySQL 的一個(gè)分支。

• MongoDB：基于分布式文件存儲(chǔ)的數(shù)據(jù)庫。

• Redis：一個(gè)開源、支持網(wǎng)絡(luò)、基于內(nèi)存、鍵值對(duì)存儲(chǔ)數(shù)據(jù)庫。

• PostgreSQL：開源的對(duì)象 - 關(guān)系型數(shù)據(jù)庫管理系統(tǒng)，Uber 早期就是用的這個(gè)。

Task Runners / Package Managers

• Grunt：JavaScript 世界的構(gòu)建工具。

• Gulp：基于流的自動(dòng)化構(gòu)建工具。

• Bower：Web 包管理器，包括 HTML，CSS，JavaScript，字體、甚至圖片資源。

• NPM：Node 包管理器。

CSS 預(yù)處理器

• Sass：一個(gè)強(qiáng)大、成熟、穩(wěn)定的 CSS 擴(kuò)展。

• Less：作為一個(gè) CSS 的擴(kuò)展，其兼容性非常好，學(xué)習(xí)成本很低。

• Stylus：提供更有效、優(yōu)雅的方式來生成 CSS。

Markdown 編輯器

• StackEdit：一個(gè)開放源碼免費(fèi)使用的 MarkDown 編輯器, 基于 PageDown。

• Dillinger：也是在線編輯器，提供云存儲(chǔ)，并支持 HTML5，PDF 等多種導(dǎo)出格式。

• Mou：Mac OS X 上一款出色的 Markdown 編輯器。

• Texts：同時(shí)支持 Windows 和 Mac OS X。

Icon 資源

• Font Awesome

• IconMonster

• IconFinder

• Fontello

Git Clients / Services

• SourceTree：一款免費(fèi)并且很酷的 Git 客戶端，支持 Windows 和 Mac。

• GitKraken (Beta)：一款免費(fèi)、直觀、漂亮的跨平臺(tái) Git 客戶端。

• Tower 2：APP 很漂亮，需付費(fèi)。

• GitHub Client：官方客戶端。

• Gogs：一個(gè)極易搭建的自助 Git 服務(wù)。

• GitLab：對(duì)私有項(xiàng)目也免費(fèi)。

本地開發(fā)環(huán)境

• XAMPP：完全免費(fèi)，容易安裝的 Apache 分布式環(huán)境。包括：MariaDB，PHP，Perl。

• MAMP：Apache + MySQL + PHP + Python + Perl。

• WampServer：Windows 下的 Web 開發(fā)環(huán)境，可以創(chuàng)建基于 Apache 2，PHP 和 MySQL 的 Web 應(yīng)用。

• Vagrant：安裝和配置簡(jiǎn)單、輕量級(jí)。

• Laragon：快速、容易搭建的 Windows 本地開發(fā)環(huán)境。包括：MySQL，PHP，Redis，Apache。

文件比對(duì)

• Diffchecker：文件比對(duì)的在線網(wǎng)站。

• Beyond Compare：老牌軟件，能快速比較文件和文件夾，功能強(qiáng)大。

Code Sharing / Experimenting

• codeshare：能和其他開發(fā)者實(shí)時(shí)共享代碼。

• JS Bin：可以將編輯后的代碼保存到本地，或?qū)?URL 地址發(fā)給其他人，讓其協(xié)助調(diào)試代碼。支持 HTML，CSS，JavaScript，Markdown，Jade 和 Sass。

• JSfiddle：能自定義環(huán)境來測(cè)試你的 HTML，CSS，JavaScript 代碼。

• Dabblet：Web playground，交互效果不錯(cuò)。

團(tuán)隊(duì)協(xié)作

• Slack：為團(tuán)隊(duì)打造的交流應(yīng)用，我們部門就在用，強(qiáng)力推薦。

• Trello：完全免費(fèi)，靈活性高，可視化，和任何人一起管理任何事情。

• Glip：支持實(shí)時(shí)消息、視頻、視頻會(huì)議、日歷分享等等功能。

• Asana：幫助追蹤、記錄團(tuán)隊(duì)成員的工作情況。

• Jira：這個(gè)大家應(yīng)該都用過吧，老牌團(tuán)隊(duì)協(xié)作應(yīng)用。

激發(fā)靈感

• CodePen：能在上面分享和找到出色的設(shè)計(jì)，還會(huì)有其他開發(fā)者為你提出建議。

• Dribble：一個(gè)設(shè)計(jì)師分享他們作品的社區(qū)。

網(wǎng)站性能測(cè)試

• Website Speed Test：KeyCDN 提供的免費(fèi)網(wǎng)站調(diào)試工具。

• Google PageSpeed Insights：測(cè)試之后還會(huì)提出優(yōu)化意見。

• WebPageTest：支持全球多地區(qū)速度測(cè)試和多種瀏覽器。

• Pingdom：測(cè)試頁面加載速度，為你找出性能瓶頸。

• GTmetrix：不光能測(cè)試速度，還能幫助分析是否有法律風(fēng)險(xiǎn)，并提出優(yōu)化建議。

Web 開發(fā)者社區(qū)

• Stack Overflow：有超過 470 萬的活躍開發(fā)者在其中互相幫助。

• Hashnode：全球性的開發(fā)者社區(qū)，大牛很多。

• Refind：面向創(chuàng)業(yè)者、開發(fā)者、設(shè)計(jì)師的 Web 項(xiàng)目分享社區(qū)。

• Google+ Web Developers Group：Web 開發(fā)者的 Google+ 社區(qū)。

• Facebook WordPress Front-end Developers Group：WordPress 的前端工程師 Facebook 小組，討論開發(fā)問題、技術(shù)趨勢(shì)。

• LinkedIn Web Design and Development Professionals Group：領(lǐng)英上的專業(yè) Web 從業(yè)者小組。

• LinkedIn PHP Developer Group：領(lǐng)英上的 PHP 開發(fā)者小組。

• Sitepoint Forums：Web 開發(fā)者論壇。

• /r/perfmatters：Reddit 上主要討論網(wǎng)站性能優(yōu)化的 subreddit，由 KeyCDN 發(fā)起。

• /r/webdev：Reddit 上討論 Web 開發(fā)的 subreddit。

Web 開發(fā)資訊

• wdrl.info：每周推送精心挑選的 Web 開發(fā)相關(guān)文章。

• web tools weekly：主要推送 Web 開發(fā)工具。

• webopsweekly.com：每周推送關(guān)于 Web 運(yùn)營(yíng)、部署等方面的文章。

• /dev tips：每周分享開發(fā)小技巧。

• friday front-end：每天在 twiiter 發(fā)開發(fā)相關(guān)資訊，可訂閱然后每周發(fā)匯總郵件。

• front-end dev weekly：手工挑選的 Web 開發(fā)、工具和創(chuàng)意資訊，每周推送。

• smashingmagazine.com：面向 Web 設(shè)計(jì)師和開發(fā)者的一款在線雜志，內(nèi)容質(zhì)量很高，每個(gè)月的第二個(gè)星期二發(fā)布。

原文地址：100+ Useful Web Development Tools and Resources.

總結(jié)

以上是生活随笔為你收集整理的100个Web开发资源（收藏）的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。