各式 Web 前端開發工具整理

程式碼編寫工具 (Coding Tools)

工作流程/建置/組合 (Workflow/Builds/Assemblers)

瀏覽器套件管理員 (Browser Package Managers) (參見: Front-End Package Manager Comparison)

CSS 基底樣式/樣板

CSS 框架 (參見: 框架比較 或 前端 CSS 框架)

HTML 基底結構/樣板

操作 DOM 的相關函式庫 (FYI: dojo, yui, ext, qooxdoo 都有自己的 DOM 工具)

各式 JavaScript 輔助工具/函式庫

鍵盤控制相關工具/函式庫

事件相關輔助工具/函式庫 (mouse/touch/pointer)

CSS 關輔助工具/函式庫

模組與指令碼載入工具/函式庫 (參見: Javascript Loaders Comparison)

JavaScript 範本引擎 (template chooser)

UI Widgets (comparison)

測試執行工具 (Test Runners)

使用者自動化測試工具 (User Automated Testing)

測試框架 (Testing Frameworks)

其他測試函式庫 (Assertion Libraries)

遠端 DOM 與 JS 測試工具

JavaScript 效能檢測工具 (JS Performance Testing)

JavaScript 自動化文件工具 (JS Auto Documentation Tools)

CSS 自動化文件工具 (CSS Auto Documentation Tools)

JavaScript 程式碼品質驗證工具 (JS Quality Validators)

CSS 品質驗證工具 (CSS Quality Validators)

HTML 品質驗證工具 (HTML Quality Validators)

JavaScript 最佳化/最小化/壓縮工具 (JS Optimizer/Minification/Compression Tools)

CSS 最佳化/最小化/壓縮工具 (CSS Optimizer/Minification/Compression Tools)

CSS 前置處理器 (Languages Compiling to CSS)

JavaScript 前置處理器 (Languages Compiling to JS) (https://altjs.org/)

HTML 前置處理器 (Languages Compiling to HTML)

純前端應用程式框架 (Front End Application Structure) (somewhat backend agnostic)

包含後端技術的前端應用程式框架 (Front End Application Structure) (with backend opinions)

整合式應用程式框架 (Full Stack Application Structure/Frameworks)

前端 JavaScript 框架 (Frontend JavaScript Frameworks) (aka Kitchen Sink Solutions, tools below provide a mixture of the things above)

參考資料/教學手冊/相容性套件/程式產生器等相關工具 (Reference/Guide/Polyfill/Generator Tools)

文件翻閱工具

瀏覽器相容性工具/文件 (Browser X Supports X)

HTML 語言參考 & 相容性工具 (HTML Language References & Polyfills)

HTML5 相關規格/參考資料與相容性套件 (HTML5 & Friends Specs/Ref & Polyfills)

DOM 相關規格/參考資料與相容性套件 (DOM Specs/Ref & Polyfills)

CSS 相關規格/參考資料與相容性套件 (CSS Specs/Ref & Polyfills)

CSS 產生器 (CSS Generators)

CSS 編寫風格與慣例指引 (CSS Style/Conventions Guides)

JavaScript ES5 相關規格/參考資料與相容性套件 (JavaScript ES5 Specs/Ref & Polyfills)

JavaScript ES6 相關規格/參考資料與相容性套件 (JavaScript ES6 Specs/Ref & Polyfills)

JavaScript 編寫風格與慣例指引 (JavaScript Style/Conventions Guides)

JSON 產生器

一般前端開發實務與開發習慣 (General Front-end Practices/Conventions)

效能調校

相關工具

準則與實務

各式線上編輯器/開發工具 (REPL)

JS REPL

JavaScript 線上編輯器 (JS focused editors)

正規表示式編輯器 (Regular Expression editors)

HTML/CSS 編輯器

HTML/CSS/JS 編輯器

執行/測試代碼工具 (Execute/Test live code)

雲端開發工具 (Browser IDE's)

JSON 編輯器

瀏覽器安全性 (Browser Security)

各式 CSS/HTML Hacks 整理 (Browser Hacks)

給前端開發人員的後端服務 (Backend services for frontend developers)

API 開發與測試工具

JSON 資料操作/查詢工具 (JSON Query Tools)

格式化工具