文章目錄

• • Javascript
  • • 工具
    • 可視化
    • 動畫插件
    • 文件操作
    • 音視頻
    • 智能化
    • 編輯器
    • 2D 3D
    • 其他常用
  • 跨平臺
  • • 框架
    • Flutter
    • Electron
    • Uniapp
  • CSS
  • • 動畫
    • 工具
    • UI
  • 編程工具
  • • 代碼工具
    • 圖像工具
    • 文件轉換
  • Vue3生態工具
  • • 1.Web UI庫
    • 2.移動UI庫
    • 3.相關工具
    • 4.可視化
    • 5.插件
    • 6.相關生態
    • 7.動畫
    • 8.音視頻
  • 全棧-后端
  • • 插件
    • 工具
    • 數據庫
    • API
    • 框架

300+編程實用工具

Javascript

工具

• Underscore.js
  一套完善的函數式編程的接口，更方便地在JavaScript中實現函數式編程
  https://underscorejs.org/
• fastclick
  用于消除物理點擊和click移動瀏覽器上事件觸發之間的 300 毫秒延遲
  https://github.com/ftlabs/fastclick
• Lodash
  一致性、模塊化、高性能的 JavaScript 實用工具庫
  https://lodash.com/
• crypto-js
  加密標準的 JavaScript 庫。
  https://github.com/brix/crypto-js
• zxcvbn
  JavaScript密碼強度估算庫
  https://github.com/dropbox/zxcvbn
• zxcvbn-ts
  支持Typescript的密碼強度估算庫
  https://github.com/zxcvbn-ts/zxcvbn
• clipboard.js
  將文本復制到剪貼板的輕量級JS 庫
  https://clipboardjs.com/
• tesseract.js
  Javascript的OCR引擎，在瀏覽器離線識別圖片中的文字
  https://tesseract.projectnaptha.com/
• number-precision
  小而快的庫，用于精確地進行加法、減法、乘法和除法運算
  https://github.com/nefe/number-precision
• fingerprintjs
  具有高準確度和穩定性的瀏覽器指紋庫
  https://fingerprint.com/
• ViteShot
  基于Vite的快速簡單的截圖工具。
  https://viteshot.com/
• Valine
  快速、簡潔且高效的無后端評論系統
  https://valine.js.org/
• cnpm
  淘寶提供的一個完整 npmjs.org 鏡像，你可以用此代替官方版本(只讀)，同步頻率目前為 10分鐘 一次以保證盡量與官方服務同步
  https://npmmirror.com/
• yarn
  快速、可靠和安全的依賴管理
  https://yarnpkg.com/
• responsively-app
  一種改進的 Web 瀏覽器，有助于響應式 Web 開發。Web 開發人員必須擁有開發工具
  https://responsively.app/
• javascript-obfuscator
  功能強大的免費 JavaScript 混淆器，包含多種功能，可為源代碼提供保護
  https://obfuscator.io/
• Nano ID
  小巧的、安全的、URL 友好的、獨特的 JavaScript 字符串 唯一 ID 生成器
  https://zelark.github.io/nano-id-cc/
• spy-debugger
  一站式頁面調試、抓包工具。遠程調試任何手機瀏覽器頁面，任何手機移動端webview（如：微信，HybridApp等）。支持HTTP/HTTPS，無需USB連接設備
  https://responsively.app/
• fuite
  用于查找 Web 應用程序中的內存泄漏的工具
  https://github.com/nolanlawson/fuite
• qs
  查詢字符串解析和字符串化庫
  https://github.com/ljharb/qs
• js-cookie
  用于處理 cookie 的簡單、輕量級 JavaScript API
  https://github.com/js-cookie/js-cookie
• tinymce
  排名第一的可定制、可擴展和靈活的富文本編輯器
  https://www.tiny.cloud/
• html2canvas
  允許在用戶瀏覽器上對網頁或其部分進行“截圖”
  https://html2canvas.hertzen.com/
• shepherd
  引導用戶瀏覽您的應用
  https://shepherdjs.dev/
• tinykeys
  極小的鍵盤事件監聽庫
  https://jamiebuilds.github.io/tinykeys/
• ag-grid
  用于構建企業應用程序的最佳 JavaScript 數據表
  https://www.ag-grid.com/
• tui.calendar
  功能齊全的 JavaScript 日程表
  https://ui.toast.com/tui-calendar
• screenfull
  用于跨瀏覽器使用 JavaScript Fullscreen API 的簡單包裝器
  https://sindresorhus.com/screenfull/
• Fuse.js
  JavaScript 中的輕量級模糊搜索
  https://fusejs.io/
• i18next
  用于瀏覽器或任何其他 javascript 環境（例如 Node.js、Deno）的國際化框架
  https://www.i18next.com/
• JsBarcode
  適用于 Web 和 Node.js 的易于使用但功能強大的條形碼生成器
  https://lindell.me/JsBarcode/
• path-to-regexp
  將 /user/:name 等路徑字符串轉換為正則表達式
  https://github.com/pillarjs/path-to-regexp
• await-to-js
  異步等待包裝器，無需 try-catch 即可輕松處理錯誤
  https://blog.grossman.io/how-to-write-async-await-without-try-catch-blocks-in-javascript/
• md5
  用 MD5 散列消息的 JavaScript 函數
  https://github.com/pvorb/node-md5
• mitt.js
  它足夠小，僅有200bytes，其次支持全部事件的監聽和批量移除，替代EventBus
  https://npm.im/mitt
• js-spark-md5
  MD5 算法的快速 md5 實現
  https://github.com/satazor/js-spark-md5
• nano
  小型（130 字節）、安全、URL 友好、唯一的 JavaScript 字符串 ID 生成器
  https://zelark.github.io/nano-id-cc/
• jsPDF
  用 JavaScript 生成 PDF
  https://parall.ax/products/jspdf
• ua-parser-js
  從User-Agen中檢測瀏覽器、引擎、操作系統、CPU 和設備類型/型號，占用空間相對較小（壓縮后約 17KB，壓縮后約 6KB），支持瀏覽器和 node.js 環境
  http://faisalman.github.io/ua-parser-js/
• togetherjs
  網站添加實時協作功能的JavaScript庫，兩個人可以在同一頁面上進行交互，查看彼此的光標、編輯并一起瀏覽網站
  https://togetherjs.com/
• Clusterize.js
  開源的長列表渲染庫，輕量級的原生大數據量展示
  https://clusterize.js.org/
• crypto-js-wasm
  加密標準的 javascript 庫，比 crypto-js快16 倍
  https://github.com/originjs/crypto-js-wasm
• pdfkit
  用于 Node 和瀏覽器的 JavaScript PDF 生成庫
  http://pdfkit.org/
• zx
  使用js編寫更便捷shell腳本
  https://www.npmjs.com/package/zx
• NProgress.js
  適用于應用程序的進度條，受 Google、YouTube 和 Medium 的啟發
  https://ricostacruz.com/nprogress/

可視化

• highlight.js
  JavaScript 語法高亮器，具有語言自動檢測和零依賴項
  https://highlightjs.org/
• Drawflow
  創建簡單的流程庫
  https://jerosoler.github.io/Drawflow/
• tui.image-editor
  HTML5 Canvas 的全功能圖像編輯器。它易于使用并提供強大的過濾器
  https://ui.toast.com/tui-image-editor
• viewerjs
  JavaScript 圖像查看器
  https://fengyuanchen.github.io/viewerjs/
• prism.js
  輕量級、健壯、優雅的語法高亮庫
  https://prismjs.com/
• fabric.js
  功能強大且簡單的 Canvas庫，輕松處理 HTML5 畫布元素。是畫布元素之上的交互式對象模型，也是一個SVG-to-canvas 解析器
  http://fabricjs.com/
• fullPage.js
  用于創建全屏滾動網站（也稱為單頁網站或一頁網站），并在該網站的各個部分內添加橫向滑塊
  https://alvarotrigo.com/fullPage/
• opentype.js
  OpenType 和 TrueType 字體解析器和編寫器。它允許您從瀏覽器或 node.js訪問文本的字母形式
  https://opentype.js.org/
• icones.js
  具有即時搜索功能的圖標資源管理器，由 Iconify 提供支持
  https://icones.js.org/
• reveal.js
  創建功能齊全且精美的演示文稿
  https://revealjs.com/
• carbon
  創建和共享源代碼的精美圖像
  https://carbon.now.sh/
• lucky-canvas
  基于 TS + Canvas 開發的【大轉盤 / 九宮格 / 老虎機】抽獎插件， 一套源碼適配多端框架 JS / Vue / React / Taro / UniApp / 微信小程序等
  https://100px.net/
• Darkmode.js
  在幾秒鐘內為您的網站添加暗模式/夜間模式
  https://darkmodejs.learn.uno/?_360safeparam=8406218
• ECharts
  強大的交互式圖表和瀏覽器數據可視化庫
  https://echarts.apache.org/zh/index.html
• PixiJS
  使用最快，最靈活的2D WebGL渲染器創建精美的內容
  https://pixijs.com/
• AntV - G2
  數據驅動，高度易用，可擴展的可視化圖形語法。
  https://g2plot.antv.vision/zh/
• ApexCharts.js
  基于SVG的JavaScript圖表庫，可使用簡單的API構建交互式圖表和可視化文件
• OpenLayers
  高性能，功能豐富的庫，用于在Web上創建交互式地圖。它可以顯示從任何網頁上的任何來源加載的地圖圖塊，矢量數據和標記
  https://openlayers.org/
• Two.js
  面向現代Web瀏覽器的二維繪圖api，渲染不可知實現相同的API在多種環境中得出：svg，canvas，和webgl
  https://two.js.org/
• Paper.js
  基于HTML5 Canvas的矢量圖形的圖形庫
  http://paperjs.org/
• Panolens.js
  事件驅動的基于WebGL的全景查看器。輕巧而靈活。它建立在Three.JS之上
  https://pchen66.github.io/Panolens/
• A-Frame
  用于構建 3D/AR/VR 體驗的 Web 框架
  https://aframe.io/
• mermaid-js
  以與 Markdown 類似的方式從文本生成圖表和流程圖
  https://mermaid-js.github.io/mermaid/
• mo · js
  為網站添加基于JavaScript的動態圖形
  https://mojs.github.io/
• trianglify
  Javascript 庫，用于創建獨特的、美觀的三角形圖案
  http://qrohlf.com/trianglify/
• Babylon.js
  能強大、美觀、簡單、開放的游戲和渲染引擎
  https://www.babylonjs.com/
• Oasis Engine
  高性能 Web 螞蟻圖形引擎
  https://oasisengine.cn/
• Butterfly
  基于JS的數據驅動的節點式編排組件庫
  https://butterfly-dag.gitee.io/butterfly-dag/home
• image-optimizer
  使用 Electron、Vue 和 Vite 用于優化圖像和矢量圖形的免費開源工具
  https://github.com/antonreshetov/image-optimizer
• Sketchfab
  需任何插件即可在Web頁面里嵌入交互式3D模型
  https://sketchfab.com/
• vConsole
  用于移動網頁的輕量級、可擴展的前端開發工具
  https://github.com/Tencent/vConsole
• swiper
  免費且最現代的移動觸摸滑塊，具有硬件加速過渡和驚人的原生行為
  https://swiperjs.com/
• Slidev
  面向開發人員的演示幻燈片
  https://sli.dev/
• konva
  HTML5 Canvas JavaScript 框架，它支持桌面和移動應用程序的高性能動畫、過渡、節點嵌套、分層、過濾、緩存、事件處理等等
  https://konvajs.org/
• p5.j??s
  開源的JavaScript可視化庫，processing的js實現版本
  https://p5js.org/zh-Hans/
• cesium
  用于世界級 3D 地球儀和地圖的開源 JavaScript 庫
  https://cesium.com/platform/cesiumjs/
• driver.js
  一個輕量級、無依賴的用戶引導組件
  https://kamranahmed.info/driver.js/
• vanilla-tilt.js
  平滑的 3D 傾斜 JavaScript 庫
  https://micku7zu.github.io/vanilla-tilt.js/index.html
• parallax.js
  對智能設備的方向引擎響應的視差
  http://matthew.wagerfield.com/parallax/
• signature_pad
  基于 HTML5 canvas 的平滑簽名繪制
  http://szimek.github.io/signature_pad/
• compressorjs
  JavaScript 圖像壓縮器
  https://fengyuanchen.github.io/compressorjs/
• eva.js
  用于創建交互式游戲項目的前端游戲引擎
  https://eva.js.org/
• d3
  基于數據來操作文檔的JavaScript庫
  https://d3js.org/

動畫插件

• countUp.js
  無依賴項的輕量級Javascript類，可用于快速創建以更有趣的方式顯示數字數據的動畫
  https://inorganik.github.io/countUp.js/
• impress.js
  CSS3 轉換和過渡的強大功能的演示框架
  https://impress.js.org/
• Anime.js
  輕量級的 JavaScript 動畫庫，具有簡單而強大的 API
  https://animejs.com/
• tween.js
  用于簡單動畫的 JavaScript 補間引擎，包含優化的 Robert Penner 方程
  http://tweenjs.github.io/tween.js/
• Popmotion
  制作數字、顏色和復雜字符串的動畫。該庫的主要動畫功能只有5kb左右，整個庫的容量在12kb左右
  https://popmotion.io/
• Typed.js
  打字動畫庫
  https://mattboldt.com/demos/typed-js/
• vivus.js
  在 SVG 上制作繪圖動畫的 JavaScript 庫
  https://maxwellito.github.io/vivus/
• ScrollReveal
  在元素滾入或滾出視口時為其制作動畫
  https://scrollrevealjs.org/
• canvas-confetti
  按需 五彩紙屑
  https://catdad.github.io/canvas-confetti/
• GSAP
  強大的 JavaScript 工具集，構建適用于所有主流瀏覽器的高性能動畫。動畫 CSS、SVG、畫布、React、Vue、WebGL、顏色、字符串、運動路徑、通用對象
  https://greensock.com/
• lax.js
  輕量級（<4kb gzipped）香草 JavaScript 庫，可在您滾動時創建流暢美觀的動畫
  https://github.com/alexfoxy/lax.js
• animxyz
  AnimXYZ 可幫助您為您的網站創建、自定義和組合動畫
  https://animxyz.com/
• svg.js
  用于操作和動畫 SVG 的輕量級庫
  https://svgjs.dev/docs/3.0/
• zdog
  用于畫布和 SVG 的扁平、圓形、設計師友好的偽 3D 引擎
  https://zzz.dog/
• dynamics.js
  用于創建基于物理的動畫的 JavaScript 庫
  http://dynamicsjs.com/
• Proton
  Javascript粒子動畫庫
  https://drawcall.github.io/Proton/

文件操作

• SheetJS
  可讀取和導出excel的工具庫，功能強大，支持格式眾多，支持xls、xlsx、ods(一種OpenOffice專有表格文件格式)等十幾種格式
  https://sheetjs.com/
• revogrid
  具有高級定制功能的強大虛擬數據表格
  https://revolist.github.io/revogrid/
• FileSaver.js
  客戶端保存文件的解決方案
  https://eligrey.com/blog/saving-generated-files-on-the-client-side/
• jszip
  使用 Javascript 創建、讀取和編輯 .zip 文件
  https://stuk.github.io/jszip/
• Print.js
  幫助從網絡打印的小型 javascript 庫
  https://printjs.crabbly.com/
• mammoth.js
  將 Word 文檔（.docx 文件）轉換為 HTML
  https://github.com/mwilliamson/mammoth.js
• StreamSaver.js
  直接異步將流寫入文件系統，適合大文件下載
  https://jimmywarting.github.io/StreamSaver.js/example.html
• PDF.js
  使用 HTML5 構建的可移植文檔格式 (PDF) 查看器
  https://github.com/mozilla/pdf.js
• pdfmake
  用于服務器端和客戶端的 PDF 文檔生成庫
  http://pdfmake.org/
• pdf-lib
  在任何 JavaScript 環境中創建和修改 PDF 文檔
  https://pdf-lib.js.org/
• uppy
  JavaScript 文件上傳器
  https://uppy.io/

音視頻

• moovie.js
  專注于電影的 HTML5 播放器
  https://mooviejs.com/
• meyda.js
  JavaScript 音頻特征提取庫
  https://meyda.js.org/
• howler.js
  Javascript 音頻庫
  https://howlerjs.com/
• flv.js
  HTML5 FLV 播放器
  https://github.com/Bilibili/flv.js/
• plyr
  HTML5、YouTube 和 Vimeo 播放器
  https://plyr.io/
• xgplayer 西瓜播放器
  網絡視頻和音頻播放器庫
  https://h5player.bytedance.com/
• hls.js
  可在支持 MSE 的瀏覽器中播放 HLS
  https://hls-js.netlify.app/demo/

智能化

• tensorflow.js
  用于在瀏覽器和 Node.js 訓練和部署機器學習模型
  https://tensorflow.google.cn/
• face-api.js
  用于在瀏覽器和 nodejs 中使用 tensorflow.js 進行人臉檢測和人臉識別的 JavaScript API
  https://github.com/justadudewhohacks/face-api.js/
• tracking.js
  將不同的計算機視覺算法和技術引入瀏覽器環境。通過使用現代HTML5規范，我們使您能夠進行實時顏色跟蹤，人臉檢測等
  https://trackingjs.com/
• pose-animator
  識別出人類的表情變化和肢體動作，并將其映射到2D矢量圖型上
  https://github.com/yemount/pose-animator
• ar-cutpaste
  手機上預裝工具，對著目標物體拍攝，即可將圖像復制粘貼進 Photoshop
  https://github.com/cyrildiagne/ar-cutpaste
• imgcook
  專注以 Sketch、PSD、靜態圖片等形式的視覺稿作為輸入，通過智能化技術一鍵生成可維護的前端代碼
  https://www.imgcook.com/
• nsfwjs
  幫助快速識別不合時宜的圖像
  https://nsfwjs.com/

編輯器

• Vditor
  Markdown 編輯器，支持所見即所得、即時渲染（類似 Typora）和分屏預覽模式，由 TypeScript 實現，支持原生 JavaScript、Vue、React、Angular，提供桌面版
  https://b3log.org/vditor/
• monaco-editor
  為VS Code提供支持的代碼編輯器
  https://microsoft.github.io/monaco-editor/
• bytemd
  用 Svelte 構建的 Markdown 編輯器組件。它也可以用于其他庫/框架，例如 React、Vue 和 Angular
  https://bytemd.netlify.app/
• wangEditor
  Typescript 開發的 Web 富文本編輯器， 輕量、簡潔、易用、開源免費
  https://www.wangeditor.com/
• mavonEditor
  Markdown 編輯器，支持多種個性化功能
  http://www.mavoneditor.com/
• quill
  API 驅動的富文本編輯器
  https://quilljs.com/
• codemirror5
  瀏覽器內代碼編輯器
  https://codemirror.net/
• marked
  用于解析 Markdown 的編譯器
  https://marked.js.org/
• tiptap
  完全控制文本編輯器體驗。它是可定制的，帶有大量擴展，是開源的，并且有大量的文檔
  https://tiptap.dev/

2D 3D

• dat.gui
  在 JavaScript 中更改變量的輕量級圖形用戶界面
  https://github.com/dataarts/dat.gui
• Three.js
  易于使用、輕量級、跨瀏覽器的通用 3D 庫
  https://threejs.org/
• Draco 3D
  縮和解壓縮 3D 幾何網格和點云。它旨在改進 3D 圖形的存儲和傳輸
  https://google.github.io/draco/
• stats.js
  JavaScript 性能監視器
  http://mrdoob.github.io/stats.js/
• matter-js
  一個用于 web 的 JavaScript 2D 物理引擎
  https://brm.io/matter-js/
• Oimo.js
  用于 javascript 的輕量級 3d 物理引擎，是OimoPhysics
  的完整 javascript 轉換
  http://lo-th.github.io/Oimo.js/#basic
• ammo.js
  使用 Emscripten 將 Bullet 物理引擎直接移植到 JavaScript
  https://github.com/kripken/ammo.js

其他常用

• Auto.js Pro
  Android上支持Node.js的JavaScript自動化和編程軟件
  https://pro.autojs.org/
• Inquirer.js
  實現命令行交互式界面的工具集合
  https://github.com/SBoudrias/Inquirer.js/
• chalk
  命令行美化工具
  https://github.com/chalk/chalk
• Timer.js
  簡單而輕量級的庫，無需任何依賴項來創建和管理計時器
  https://github.com/husa/timer.js
• day.js
  極簡的 JavaScript 庫，它使用與 Moment.js 兼容的 API 為現代瀏覽器解析、驗證、操作和顯示日期和時間
  https://day.js.org/
• Socket.io
  支持基于事件的實時雙向通信
  https://socket.io/
• The Algorithms
  GitHub 最大的開源算法庫
  https://the-algorithms.com/
• log-symbols
  各種日志級別的彩色符號
  https://github.com/sindresorhus/log-symbols
• plop
  微型生成器框架，使整個團隊可以輕松地創建具有一定一致性的文件
  https://plopjs.com/
• prompts
  輕量級、美觀且用戶友好的交互式提示
  https://github.com/terkelg/prompts
• shelljs
  基于 Node.js API 的 Unix shell 命令的可移植（Windows/Linux/macOS）實現
  https://www.npmjs.com/package/shelljs
• figlet
  瀏覽器控制臺個性化輸出
  https://github.com/patorjk/figlet.js
• picocolors
  終端修改輸出字符樣式的 npm 包，比 chalk 體積小 14 倍，速度快 2 倍
  https://github.com/alexeyraspopov/picocolors
• cac
  用于構建 CLI 應用程序的 JavaScript 庫，體積數倍小于 commander 和 yargs
  https://github.com/cacjs/cac
• npm-run-all
  用于并行或順序運行多個 npm 腳本的 CLI 工具
  https://github.com/mysticatea/npm-run-all
• node-semver
  語義化版本號管理的 npm 庫，比如 判斷一個版本是否合法，判斷版本號命名是否正確，兩個版本誰大誰小之類 等
  https://github.com/npm/node-semver
• puppeteer
  在瀏覽器中手動執行的大多數操作都可以使用 Puppeteer 完成
  生成頁面的屏幕截圖和 PDF。
  抓取 SPA（單頁應用程序）并生成預渲染內容
  自動化表單提交、UI 測試、鍵盤輸入等。
  https://pptr.dev/
• temir
  用vue組件來編寫命令行界面應用的工具
  https://github.com/webfansplz/temir
• enquirer
  適用于 Node.js 的時尚、直觀且用戶友好的提示
  https://github.com/enquirer/enquirer

跨平臺

框架

• uni-app
  使用 Vue.js 開發所有前端應用的框架，開發者編寫一套代碼，可發布到iOS、Android、Web（響應式）、以及各種小程序等13個平臺
  https://uniapp.dcloud.io/
• react-native
  使用 React 構建移動應用程序
  https://reactnative.dev/
• Flutter
  Google 的開源框架，用于構建美觀、本機編譯的多平臺應用程序
  https://flutter.dev/
• chameleon
  一套代碼運行多端，一端所見即多端所見
  http://cml.didi.cn/
• Taro
  遵循 React 語法規范的多端統一開發框架
  https://taro.zone/
• Electron
  使用 JavaScript，HTML 和 CSS 構建跨平臺的桌面應用程序
  https://www.electronjs.org/
• MicroApp
  京東零售推出的微前端框架。基于webcomponent-like渲染，從組件思維實現微前端，旨在降低上手難度，提高工作效率
  https://micro-zoe.github.io/micro-app/
• Tauri
  使用 Web 前端構建更小、更快、更安全的桌面應用程序
  https://tauri.studio/
• Hippy
  跨平臺的開發框架，旨在幫助開發者編寫一次，運行在三個平臺（iOS、Android 和 Web）上
  https://hippyjs.org/#/
• 無界
  基于 Web Components + iframe 微前端框架，具備成本低、速度快、原生隔離、功能強等一系列優點。
  https://wujie-micro.github.io/doc/
• qiankun
  微前端的實現，基于single-spa。它旨在使構建生產就緒的微前端架構系統變得更加容易和輕松。
  https://qiankun.umijs.org/zh

Flutter

• pub.dev
  Dart和Flutter應用程序的官方包存儲庫
  https://pub.dev/
• awesome-flutter-plugins
  盡可能收集好用的Flutter插件以便更效率的開發
  https://github.com/jahnli/awesome-flutter-plugins
• flutter-widget.live
  使用 Flutter for web 構建的網站，用于在線實時預覽小部件示例。
  https://flutter-widget.live/basics/introduction
• google Icons
  Google Material Design 圖標
  https://fonts.google.com/icons
• Json To Dart Model
  Json 轉 Dart Model類
  https://ashamp.github.io/jsonToDartModel/
• flutter awesome
  很棒的列表，其中包含優秀的 Flutter 庫和工具
  https://flutterawesome.com/
• LottieFiles
  免費 Lottie 動畫文件、工具和插件
  https://lottiefiles.com/

Electron

• vue-cli-plugin-electron-builde
  使用Electron輕松構建用于桌面的Vue.js應用
  https://nklayman.github.io/vue-cli-plugin-electron-builder/
• electron-about-window
  為Electron 提供 “關于此應用程序” 窗口。
  https://github.com/rhysd/electron-about-window
• nativefier
  使任何網頁成為桌面應用程序
  https://github.com/nativefier/nativefier

Uniapp

• Grace UI
  兼容微信小程序及uni-app的優秀前端框架，以flex布局為基礎，提供了豐富的組件及界面庫GraceUI
  https://www.graceui.com/
• uView
  全面兼容nvue的uni-app生態框架，全面的組件和便捷的工具
  https://www.uviewui.com/
• ThorUI
  輕量、簡潔、全面的移動端組件庫
  https://thorui.cn/doc/

CSS

動畫

• cssfx
  精美簡單的點擊復制 CSS 效果
  https://cssfx.netlify.app/
• Twitter Hashflags
  Twitter 點贊動畫
  https://hashflags.io/
• UI Snippets
  UI 片段的集合
  https://ui-snippets.dev/
• SpinKit
  CSS 動畫的加載指示器
  https://tobiasahlin.com/spinkit/
• animate.css
  強大的預設css3動畫庫
  https://animate.style/
• 犸良
  一站式動效制作平臺，通過海量的動效素材以及可視化編輯能力，幫助零基礎的用戶輕松完成動效制作
  https://design.alipay.com/emotion
• animista
  Css 動畫
  https://animista.net/
• lordicon
  功能強大的精心制作的動畫圖標庫
  https://lordicon.com/
• svg-spinners
  24 x 24 dp的svg格式loading加載器
  https://github.com/n3r4zzurr0/svg-spinners
• magic
  具有炫酷效果的 CSS3 動畫
  https://www.minimamente.com/project/magic/
• Hover.css
  CSS3 驅動的懸停效果，可應用于鏈接、按鈕、徽標、SVG、特色圖像等
  http://ianlunn.github.io/Hover/
• eva-icons
  超過 480 個制作精美的開源圖標。SVG、Sketch、Web 字體和動畫支持
  https://akveo.github.io/eva-icons/#/

工具

• normalize.css
  CSS 重置的現代替代方案
  http://necolas.github.io/normalize.css/
• Squoosh
  對比 tinypng 有【更好的】壓縮效果
  https://squoosh.app/

UI

• Manypixels
  收集無版權插圖的網站，提供 SVG / PNG 格式下載，并且允許更改顏色
  https://www.manypixels.co/gallery
• U鈣網
  免費的LOGO在線設計制作工具
  https://www.uugai.com/
• design-blocks
  一組 170 多個基于 Bootstrap 的設計塊，可用于創建干凈的現代網站
  https://froala.com/design-blocks/
• unDraw
  精美的 SVG 插畫集
  https://undraw.co/illustrations
• Ira Design
  通過調配漸變色、搭配手繪組件定制插畫
  https://iradesign.io/gallery/illustrations
• lukasz adam
  免費 SVG 插畫
  https://lukaszadam.com/illustrations
• pixeltrue
  創建令人嘆為觀止的項目的插圖
  https://www.pixeltrue.com/packs
• 3dicons
  3d圖標庫
  https://3dicons.co/
• css-buttons
  100 個現代 CSS 按鈕
  https://css-buttons.web.app/
• uiset
  優質免費的UI設計資源
  https://uiset.com/
• error404
  404插畫頁面
  https://error404.fun/
• ui8
  5,745 個精選設計資源，為您的創意工作流程注入活力
  https://ui8.net/

編程工具

代碼工具

• gitignore.io
  為項目創建有用的 .gitignore 文件
  https://www.toptal.com/developers/gitignore
• any-rule
  常用正則大全, 支持web / vscode / idea / Alfred Workflow多平臺
  https://any86.github.io/any-rule/
• 30-seconds-of-code
  滿足多種語言開發需求的簡短代碼片段
  https://www.30secondsofcode.org/
• github-readme-stats
  為 github 自述文件動態生成的統計信息
  https://github.com/anuraghazra/github-readme-stats
• cz-cli
  規范提交說明的git工具
  http://commitizen.github.io/cz-cli/
• commitlint
  git commit 校驗工具
  https://commitlint.js.org/#/
• husky
  Git hooks 工具，可以防止使用 Git hooks 的一些不好的 commit 或者 push
  https://typicode.github.io/husky/#/
• lint-staged
  代碼提交之前,進行代碼規則檢查并嘗試修復，能夠確保進入git庫的代碼都是符合代碼規則
  https://github.com/okonet/lint-staged
• anywhere
  隨啟隨用的靜態文件服務器
  https://github.com/JacksonTian/anywhere
• code996
  統計 Git 項目的 commit 時間分布，進而推導出這個項目的編碼工作強度
  https://hellodigua.github.io/code996/#/

圖像工具

• bigjpg
  使用度卷積神經網絡。它會將噪點和鋸齒的部分進行補充，實現圖片的無損放大
  https://bigjpg.com/
• jpghd
  使用人工智能 AI 超分模型和深度學習技術來將低清破損有噪點圖片處理成高畫質高分辨率圖片同時支持破損老照片修復和老照片上色
  https://jpghd.com/
• bigmp4
  使用智能 AI 模型，能將視頻無損高清放大、增強畫質、智能補幀使畫面絲滑流暢栩栩如生同時支持黑白視頻上色和慢動作
  https://bigmp4.com/
• imglarger
  基于強大的機器學習可在不降低質量的情況下提高圖像分辨率
  https://imglarger.com/
• unscreen
  智能AI去除視頻背景在線神器
  https://www.unscreen.com/
• 阿里媽媽創意中心
  阿里智能文案，智能摳圖工具
  https://chuangyi.taobao.com/

文件轉換

• ALL TO ALL
  全類型的在線文件轉換平臺，免費、快速，無須下載安裝任何軟件
  https://www.alltoall.net/
• Convertio
  將文件轉換成任意格式
  https://convertio.co/zh/

Vue3生態工具

1.Web UI庫

• ElementUI Plus
  一套為開發者、設計師和產品經理準備的基于 Vue 3.0 的桌面端組件庫
  https://element-plus.org/zh-CN/
• Ant Design of Vue
  Ant Design 的 Vue 實現，開發和服務于企業級后臺產品
  https://www.antdv.com/docs/vue/introduce-cn
• BalmUI
  基于谷歌的 Material Design，附帶 Vue 插件和指令，以及從簡單到復雜的高度可定制組件
  https://next-material.balmjs.com/
• Naive UI
  圖森Vue3的組件庫，文檔完整，我項目中經常使用
  https://www.naiveui.com/zh-CN/os-theme
• arco.design
  字節跳動企業級產品設計系統，支持React和Vue雙版本
  https://arco.design/
• Quasar
  輕松構建高性能和高質量的Vue.js 3用戶界面，好用，但沒有中文文檔
  https://quasar.dev/
• iDUX
  Vue3.x 的 UI 組件庫，完全使用 TypeScript 開發
  https://idux.site/
• TDesign
  騰訊業務團隊在服務業務過程中沉淀的一套企業級設計體系
  https://tdesign.tencent.com/
  https://tdesign.tencent.com/vue-next/overview
• PrimeVue
  易于使用、多功能、高性能的 Vue UI 組件庫
  https://www.primefaces.org/primevue/
• DevUI
  華為基于 Vue3 和 DevUI 設計的 UI 組件
  https://vue-devui.github.io/
• vuestic-ui
  Vue 3 的免費和開源 UI 庫 ,UI非常好看，并且有可用后臺管理界面。
  https://vuestic.dev/
• Headless UI
  完全無樣式、完全可訪問的 UI 組件，旨在與 Tailwind CSS 完美集成。
  https://headlessui.com/
• View UI Plus
  基于 Vue.js 3 的企業級 UI 組件庫和前端解決方案
  https://www.iviewui.com/

2.移動UI庫

• Vant
  有贊輕量、可靠的移動端組件庫
  https://vant-contrib.gitee.io/vant/#/zh-CN
• NutUI
  京東風格的輕量級移動端 Vue 組件庫，非常適合移動端電商使用。
  https://nutui.jd.com/#/
• Varlet
  Material 風格移動端組件庫 ，文檔非常齊全。
  https://varlet.gitee.io/varlet-ui/#/zh-CN/home
• nutui-bingo
  京東基于 NutUI 的抽獎組件庫，助力營銷活動和小游戲場景。
  https://nutui.jd.com/bingo/#/

3.相關工具

• unplugin-vue-components
  antfu 按需組件自動導入，開箱即用地支持 Vue 2 和 Vue 3，Tree-shakable，只注冊你使用的組件，附有流行UI 庫的內置解析器。
  https://www.npmjs.com/package/unplugin-vue-components
• vuex-persistedstate
  在頁面重新加載之間保持并重載您的 Vuex 狀態
  https://github.com/robinvdvleuten/vuex-persistedstate
• vuex-persist
  支持 Typescript 的Vuex插件，它能夠將應用程序的狀態保存到持久存儲中，例如 Cookies 或 localStorage
  https://championswimmer.in/vuex-persist/
• @vueuse/gesture
  手勢庫，使應用程序具有交互性
  https://gesture.vueuse.org/
• unplugin-auto-import
  antfu 自動導入 Vite、Webpack、Rollup 和 esbuild 的 API。支持 TypeScript。
  https://github.com/antfu/unplugin-auto-import
• pinia-plugin-persistedstate
  Pinia 商店的可配置持久性
  https://github.com/prazdevs/pinia-plugin-persistedstate
• https://vue-termui.dev/
  一個基于 Vue.js 的終端 UI 框架，可讓您輕松構建現代終端應用程序
  https://vue-termui.dev/

4.可視化

• Pdfvuer
  DF 查看器，使用 Mozilla 的 PDF.js，支持 Vue2 和 Vue3
  https://arkokoley.github.io/pdfvuer/
• vue3-marquee
  無縫滾動組件
  https://vue3-marquee.vercel.app/
• Vue-ECharts
  百度ECharts 的 Vue.js 組件。 配置參考Echarts官方 基于 ECharts v5+ 開發，適用于Vue.js 2/3。
  https://vue-echarts.dev/
• iconpark
  字節跳動出品，將一個SVG圖標轉化為多個主題，并生成React圖標，Vue圖標，svg圖標
  https://iconpark.oceanengine.com/home

5.插件

• vue-multiselect-next
  Vue.js 的通用選擇/多選/標記組件
  https://vue-multiselect.js.org/
• vue-print-nb
  用于印刷、簡單、快速、方便、輕便的指令包裝器
  https://github.com/Power-kxLee/vue-print-nb
• vue-i18n-next
  Vue3的國際化插件
  https://vue-i18n.intlify.dev/
• vue-cropper
  簡單的vue圖片裁剪插件
  http://github.xyxiao.cn/vue-cropper/example/
• Grid Layout
  Vue.js 的網格布局系統
  https://jbaysolutions.github.io/
• Vue Qrcode Reader
  允許在不離開瀏覽器的情況下檢測和解碼二維碼
  https://gruhn.github.io/vue-qrcode-reader/
• Makeit Captcha
  基于 Vue3 + Vite + Canvas 開發的滑塊驗證碼，動態生成驗證滑塊，結合后端的二次校驗，能有效的避免被抓取模擬驗證https://admin.makeit.vip/components/captcha
• vue3-clipboard
  Vue 3 的 clipboard.js
  https://github.com/soerenmartius/vue3-clipboard
• vue.draggable
  基于Sortable.js的Vue 3拖放組件
  https://sortablejs.github.io/vue.draggable.next/#/simple
• BetterScroll
  解決移動端（已支持 PC）各種滾動場景需求的插件。
  https://better-scroll.github.io/docs/zh-CN/

6.相關生態

• Vue 插件庫
  https://www.vue365.cn/
• Pinia
  輕量級狀態管理庫，API 設計更接近Vuex 5的提案
  https://pinia.vuejs.org/
• Nuxt Modules
  Nuxt 發現我們的模塊列表以增強您的Nuxt 項目
  https://modules.nuxtjs.org/
• Nuxt 3
  輕量級應用框架,可用來創建服務端渲染 (SSR) 應用
  https://v3.nuxtjs.org/
• vuepress
  Vue 驅動的靜態網站生成器
  https://v2.vuepress.vuejs.org/zh/
• VueUse
  強大的 Vue 組合實用程序集合
  https://vueuse.org/

7.動畫

• vue-starport
  帶有動畫的跨路由共享組件
  https://vue-starport.netlify.app/
• @vueuse/motion
  Vue Composables 讓你的組件動起來
  https://motion.vueuse.org/

8.音視頻

• @vueuse/sound
  用于播放音效的 Vue 組合
  https://sound.vueuse.org/

全棧-后端

插件

• isomorphic-git
  用于節點和瀏覽器的 git 純 JavaScript 實現
  https://isomorphic-git.org/
• jsonwebtoken
  node.js 的 JsonWebToken 實現
  https://github.com/auth0/node-jsonwebtoken
• Qiniu SDK
  七牛資源（云）存儲 SDK for Node.js
  https://developer.qiniu.com/kodo/sdk/nodejs
• koa-body
  功能齊全的koa正文解析器中間件，支持multipart、urlencoded和json請求正文，提供與 Express 的 bodyParser 相同的功能
  https://github.com/koajs/koa-body
• koa-json-error
  純Koa JSON 應用程序的錯誤處理程序，顯示堆棧跟蹤
  https://github.com/koajs/json-error
• koa-jwt
  用于驗證 JSON Web 令牌的 Koa 中間件
  https://github.com/koajs/jwt
• koa-router
  Koa 的路由器中間件
  https://github.com/koajs/router
• koa2-cors
  koa2 的 CORS 中間件
  https://github.com/zadzbw/koa2-cors
• koa-sslify
  為 Koa.js 實施 HTTPS 中間件
  https://github.com/turboMaCk/koa-sslify
• superagent-proxy
  允許您通過某種代理來代理 HTTP 請求
  https://github.com/TooTallNate/superagent-proxy
• node-http-proxy-agen
  HTTP 端點的 HTTP(s) 代理“http.Agent”實現
  https://github.com/TooTallNate/node-http-proxy-agent
• https-proxy-agent
  HTTPS 端點的 HTTP(s) 代理“http.Agent”實現
  https://github.com/TooTallNate/node-https-proxy-agent
• socks-proxy-agent
  用于 HTTP 和 HTTPS 的 SOCKS (v4/v5) 代理“http.Agent”實現
  https://github.com/TooTallNate/node-socks-proxy-agent
• simple-get
  發出 http get 請求的最簡單方法。支持 HTTPS、重定向、gzip/deflate、小于 100 行的流
  https://github.com/feross/simple-get
• commander.js
  node.js命令行界面的完整解決方案
  https://github.com/tj/commander.js
• ora
  命令行 loading 動效
  https://github.com/sindresorhus/ora
• dotenv
  從 .env 為 nodejs 項目加載環境變量
  https://github.com/motdotla/dotenv
• FFCreator
  基于node.js的高速視頻制作庫
  https://tnfe.github.io/FFCreator/#/
• sharp
  高性能 Node.js 圖像處理，調整 JPEG、PNG、WebP、AVIF 和 TIFF 圖像大小的最快模塊
  https://sharp.pixelplumbing.com/
• node-fs-extra
  強大的文件操作庫， 是 Nodejs fs 模塊 的增強版
  https://github.com/jprichardson/node-fs-extra
• chokidar
  用于文件監控的庫，解決兼容性不好、無法監聽、監聽多次 等大量影響性能的問題
  https://paulmillr.com/
• fast-glob
  快速批量導入、讀取文件的庫
  https://github.com/mrmlnc/fast-glob
• peerflix
  node.js 的流式 torrent 客戶端
  https://github.com/mafintosh/peerflix

工具

• Nginx
  高性能的HTTP和反向代理web服務器，同時也提供了IMAP/POP3/SMTP服務
  https://blog.redis.com.cn/doc/
• PM2
  Node進程管理工具，如性能監控、自動重啟、負載均衡等
  https://pm2.keymetrics.io/docs/usage/process-management/
• nodemon
  監視 node.js 應用程序中的任何更改并自動重新啟動服務器
  https://nodemon.io/
• RobotJS
  Node.js 桌面自動化，控制鼠標、鍵盤和閱讀屏幕等
  http://robotjs.io/
• Jenkins
  領先的開源自動化服務器，Jenkins 提供了數百個插件來支持構建、部署和自動化任何項目
  https://www.jenkins.io/
• nexe
  將 node.js 應用程序中創建一個可執行文件
  https://github.com/nexe/nexe
• debug
  模仿 Node.js 核心調試技術的小型 JavaScript 調試實用程序。適用于 Node.js 和 Web 瀏覽器
  https://github.com/debug-js/debug

數據庫

• mongoose
  旨在在異步環境中工作的 MongoDB 對象建模
  https://mongoosejs.com/
• GraphQL
  用于 API 的查詢語言也是一個滿足你數據查詢的運行時
  https://graphql.cn/
• lowdb數據庫
  適用于Node，Electron和瀏覽器的小型JSON數據庫。由Lodash驅動
  https://github.com/typicode/lowdb
• nedb
  適用于Node.js，nw.js，Electron和瀏覽器的嵌入式持久性數據庫或內存數據庫,API是MongoDB的子集
  https://github.com/louischatriot/nedb

API

• 網易云音樂 API
  全部接口已升級到最新，具備登錄接口,多達200多個接口
  https://binaryify.github.io/NeteaseCloudMusicApi/#/
• Node-SpliderApi
  基于 Node+Express 網絡爬蟲 API 接口 包括前端開發日報、kugou 音樂、前端 top 框架排行、妹紙福利、搞笑視頻、段子笑話、各類視頻新聞資訊 熱點詳情接口數據,接口數據更新目標
  https://ecitlm.github.io/Node-SpliderApi/
• 聚合數據
  免費向開發者提供全國車輛違章查詢API,天氣API,基站數據,移動聯通基站,電信基站,覆蓋國內外1000多個主要城市公共交通信息數據
  https://www.juhe.cn/
• 極速數據
  提供各類生活數據API,方便開發者快速簡單的開發APP、軟件及其他服務平臺
  https://www.jisuapi.com/
• 京東萬象
  供金融、電商、運營商數據,免費數據,熱門數據,學籍數據,企業訴訟數據,實名認證,征信數據,質檢等多種數據
  https://wx.jdcloud.com/api
• QQ音樂API
  通過Web網頁版請求QQ音樂接口數據
  https://rain120.github.io/qq-music-api/#/
• 萬維易源
  一站式全網API調用平臺
  https://www.showapi.com/
• TP5 Splider Api
  基于Thinkphp5+phpQuery 網絡爬蟲抓取數據接口 統一輸出接口數據api
  https://ecitlm.github.io/TP5_Splider/#/
• Roll API
  提供開發中常用數據的一個穩定聚合Api接口
  https://www.mxnzp.com/doc/list
• Open API
  收集可用的Open APIs
  https://www.wanandroid.com/openapis
• 天行數據
  160多個免費接口，接口高度統一，簡單易用，毫秒級響應
  https://www.tianapi.com/
• free-api
  免費API,收集免費的接口服務
  https://www.free-api.com/
• douban-imdb-api
  基于豆瓣、IMDB、爛番茄評分的電影電視劇雙語(中英)數據api接口
  https://www.iqi360.com/p/douban-imdb-api

框架

• Koa
  基于 Node.js 平臺的下一代 web 開發框架
  https://koajs.com/
• Express
  用于Node.js 的快速、獨立、簡約的 Web 框架
  https://expressjs.com/
• egg.js
  為企業級框架和應用而生
  https://www.eggjs.org/
• Nest.js
  構建高效且可擴展的服務器端應用程序的漸進式Node.js框架
  https://nestjs.com/

XMind: ZEN - Trial Version

總結

以上是生活随笔為你收集整理的2022年技术胖私藏工具分享的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。