Frontend Web Developer Glossary 前端開發工具詞彙表
2021-08-08
紀錄前端開發常見的各式詞彙表、新興工具名稱，讓這個每 18 至 24 個月學習難度都會倍增的領域能夠更平易近人。
清單
御三家
| 詞彙 | 說明 | 備註 |
|---|---|---|
| Vue.js | VAR 前三端大框架之一 | Ex-Googler |
| React | VAR 前三端大框架之一 | |
| Angular | VAR 前三端大框架之一 | |
| Vuex | 狀態管理工具 | Vue.js |
你的英勇長存人心
| 詞彙 | 說明 | 備註 |
|---|---|---|
| Ember.js | MVVM 前端框架 | 前端框架的祖師爺，目前仍有第四名的熱門程度 |
| Knockout.js | MVVM 前端框架 | |
| Backbone.js | Model Binding 輕量前端框架 | |
| hadlebars.js | JS Template | Mustache.js 挑戰者 |
| Mustache.js | JS Template |
共通工具
| 詞彙 | 說明 | 備註 |
|---|---|---|
| NPM | JS 模組管理工具 | 領導者 |
| PNPM | JS 模組管理工具 | NPM 挑戰者 |
| YARN | JS 模組管理工具 | NPM 挑戰者 |
| Bower | JS 模組管理工具 | Deprecated |
| npx | 相對於 NPM 執行而非安裝套件 | |
| Webpack | 任務管理、打包工具 | 領導者 |
| Vite | 打包工具、開發環境搭造 | Webpack 挑戰者 |
| Gulp | function style 任務管理工具 | |
| Grunt | config style 任務管理工具 | |
| Browserify | ||
| Sass | CSS Extension Language | |
| Scss | 同 Sass 語法則近似 CSS | |
| Less | CSS Extension Language | |
| PostCss | CSS 檔案後處理工具 | |
| Babel | 轉譯 JS 工具 向下相容、瀏覽器相容 | |
| SSR | Server Side Rende, 處理 SEO 問題 | |
| Next.js | React SSR 工具 | |
| Nuxt.js | Vue.js SSR 工具 | |
| Hexo | Static Content Generator | Node.js |
| Hugo | Static Content Generator | Go Lang |
| Jekyll | Static Content Generator | Ruby |
| VuePress | Static Content Generator | Vue |
| VitePress | Static Content Generator | Vue with Vite |
| BEM | CSS Style | |
| Flutter | PWA Framework | |
| Electron | Desktop Application Framework | |
| ESLint | 程式碼風格、品質檢查工具 | |
| Prettier | 程式碼排版工具 |
Grunt vs gulp vs Webpack | stackshare
DRY & Ideas 💡
JONAS' RESOURCES FOR HAND-CRAFTING BEAUTIFUL AND PERFORMANT WEBSITES
What Were the Hottest Front-End Tools in 2021?
10015.io
- SVG Pattern Generate
- Color Picker
- JWT Encoder