1. 前言 大家好，我是沙漠盡頭的狼。 Dotnet工具箱是一個純前端的、開源和免費的工具網站，周末我參考了開源項目it-tools，對網站界面文字進行了漢化，並重新部署了網站。該網站共有10大工具分類，提供了73個實時線上小工具。使用Vue3開發的Dotnet工具箱具有獨特的特色，本文詳細介紹了其 ...
1. 前言
大家好，我是沙漠盡頭的狼。
Dotnet工具箱是一個純前端的、開源和免費的工具網站，周末我參考了開源項目it-tools，對網站界面文字進行了漢化，並重新部署了網站。該網站共有10大工具分類，提供了73個實時線上小工具。使用Vue3開發的Dotnet工具箱具有獨特的特色，本文詳細介紹了其中一些特色工具，並簡單分享瞭如何部署自己的工具網站。如果你對工具網站感興趣，不妨來瞭解一下Dotnet工具箱吧！
Dotnet工具箱已有工具如下：
關於Dotnet工具箱和it-tools項目
Dotnet工具箱倉庫（基於it-tools）：https://github.com/dotnet9/Dotnet9/tree/develop/src/Dotnetools
it-tools倉庫：https://github.com/CorentinTh/it-tools
it-tools開源協議：GPL-3.0 license
it-tools線上工具：https://it-tools.tech/
截至本文編寫時，Dotnet工具箱只是對it-tools項目進行了界面文字漢化，後續打算如果自己有需求會根據該項目規範進行擴展開發，大家有興趣可以：
參與it-tools開發：https://github.com/CorentinTh/it-tools
參與Dotnet工具箱開發：https://github.com/dotnet9/Dotnet9/tree/develop/src/Dotnetools
糾正Dotnet工具箱中文翻譯、提Issue、提PR都請訪問：https://github.com/dotnet9/Dotnet9
2. 工具介紹
選擇10大工具分類部分介紹，每個大類介紹部分。
2.1. 加解密
加解密共有11個小工具。
2.1.1. Token、隨機密碼生成器
線上工具訪問地址：https://dotnetools.com/token-generator
生成自定義長度，包含大寫或小寫字母、數字或符號的隨機字元串。
2.1.2. 哈希文本生成器
線上工具訪問地址：https://dotnetools.com/hash-text
使用所需的函數對文本字元串進行哈希：MD5, SHA1, SHA256, SHA224, SHA512, SHA384, SHA3 或 RIPEMD160
2.1.3. 文本加密、解密
線上工具訪問地址：https://dotnetools.com/encryption
使用AES、TripleDES、Rabbit或RC4等加密演算法對文本明文進行加密和解密。
2.1.4. RSA密鑰對生成器
線上工具訪問地址：https://dotnetools.com/rsa-key-pair-generator
生成新的隨機RSA私鑰和公鑰pem證書。
2.1.5. 密碼強度分析器
線上工具訪問地址：https://dotnetools.com/password-strength-analyser
使用此僅限客戶端的密碼強度分析器和破解時間估計工具來發現您的密碼強度。
2.2. 換算器
換算器共有15個小工具。
2.2.1. 日期時間轉換器
線上工具訪問地址：https://dotnetools.com/date-converter
將日期和時間轉換為各種不同的格式
2.2.2. 線上進位換算
線上工具訪問地址：https://dotnetools.com/base-converter
線上進位換算，在常用的二進位、六進位、十進位等進位單位之間的轉換，還能自定義轉換其他進位單位，比如50進位、100進位...。
2.2.3. Base64字元串編碼/解碼
線上工具訪問地址：https://dotnetools.com/base64-string-converter
簡單將字元串編碼和解碼為base64表示。
2.2.4. Base64文件轉換器
線上工具訪問地址：https://dotnetools.com/base64-file-converter
將字元串、文件或圖像轉換為它的base64表示形式。
- 粘貼對應的文件base64字元串轉換為文件下載
- 上傳文件轉換為base64字元串進行複製
2.2.5. 顏色轉換器
線上工具訪問地址：https://dotnetools.com/color-converter
在不同格式之間轉換顏色 (hex, rgb, hsl and css name)，常用於前端開發（比如Web、桌面軟體、移動端）
2.2.6. JSON 轉 YAML
線上工具訪問地址：https://dotnetools.com/json-to-yaml-converter
線上將JSON轉換為YAML的轉換器，類似的還有YAML轉JSON、YAML轉TOML、JSON轉TOML、列表數據轉換器、TOML轉JSON、TOML轉YAML。
2.3. 網站
網站分類有15個小工具。
2.3.1. URL字元串編解碼
線上工具訪問地址：https://dotnetools.com/url-encoder
編碼為url編碼格式（也稱為“百分比編碼”）或從中解碼。
2.3.2. html元素轉義
線上工具訪問地址：https://dotnetools.com/html-entities
html元素轉義或取消轉義(替換 <,>, &, " and ' 為對應的html版本)，這可能主要用於後端給前端的網頁內容時使用，特殊符號需要轉義後才能正常使用
2.3.3. Url分析器
線上工具訪問地址：https://dotnetools.com/url-parser
解析url字元串以獲得所有不同的部分（協議、來源、參數、埠、用戶名密碼…）
2.3.4. 設備信息
線上工具訪問地址：https://dotnetools.com/device-information
獲取有關當前設備的信息（屏幕大小、像素比例、用戶代理等）
2.3.5. 別名字元串
工具介紹：使字元串 URL、文件名和 id 安全。
這是一篇關於別名的介紹什麼是URL slug 及其對 SEO 的重要性：
slug 對於關鍵字 SEO 來說非常強大。如果用戶要在 Google 搜索“什麼是 slug”，則內容 URL 結構中的關鍵字有助於向 Google 發出信號，表明內容應該包含在 SERP 中。如果一個好的
slug 清楚地說明瞭網頁的內容，它可以改善用戶的體驗。
本文也使用了別名字元串工具，截圖如下：
步驟是：
- 在百度翻譯中翻譯文章標題“Dotnet工具箱：開源、免費的純前端工具網站，帶你探索10大工具分類和73個實時線上小工具”；
- 將得到的英文標題“Dotnet Toolbox: Open source, free pure front-end tool website that takes you to explore 10 major tool categories and 73 real-time online small tools”複製到別名字元串工具【需要轉別名的字元串】輸入框；
- 點擊【複製別名】將【別名】輸入框中轉換的別名字元串粘貼到本文Markdown文件內，文件也以轉換的【[別名].md】命名；
- 使用別名訪問本文：https://dotnet9.com/2023/10/dotnet-toolbox-open-source-free-pure-front-end-tool-website-that-takes-you-to-explore-10-major-tool-categories-and-73-real-time-online-small-tools9
2.3.6. HTTP 狀態代碼
線上工具訪問地址：https://dotnetools.com/http-status-codes
所有 HTTP 狀態代碼的列表，其名稱和含義。
2.3.7. JSON對比
線上工具訪問地址：https://dotnetools.com/json-diff
比較兩個 JSON 對象並獲取它們之間的差異。
2.4. 圖片和視頻
有4個小工具。
2.4.1. 二維碼生成器
線上工具訪問地址：https://dotnetools.com/qrcode-generator
生成並下載 url 或僅文本的二維碼，並自定義背景和前景色。
下麵是上面的操作生成的二維碼，微信掃碼可打開Dotnet工具箱網站：
2.4.2. SVG 占位符生成器
線上工具訪問地址：https://dotnetools.com/svg-placeholder-generator
生成 svg 圖像以用作應用程式中的占位符，主要用於網站圖片未載入完成時的占點陣圖片。
2.4.3. 攝像機錄像機
線上工具訪問地址：https://dotnetools.com/camera-recorder
從網路攝像頭或相機拍照或錄製視頻。
2.5. 開發
開發分類共有10個小工具。
2.5.1. Crontab生成器
線上工具訪問地址：https://dotnetools.com/crontab-generator
驗證並生成 crontab，並獲取 cron 計劃的人類可讀描述。
2.5.2. JSON 美化和格式化
線上工具訪問地址：https://dotnetools.com/json-prettify
將 JSON 字元串美化為人類友好的可讀格式，對應的就有JSON壓縮工具。
2.5.3. SQL 美化和格式化
線上工具訪問地址：https://dotnetools.com/sql-prettify
線上格式化和美化您的 SQL 查詢語句（它支持各種 SQL 變種）。
2.5.4. Docker compose轉換器
線上工具訪問地址：https://dotnetools.com/docker-run-to-docker-compose-converter
將docker運行命令轉換為docker-compose文件!
2.5.5. XML 格式化
線上工具訪問地址：https://dotnetools.com/xml-formatter
將 XML 字元串美化為人類友好的可讀格式。
2.x. 其他分類
小工具太多，逐一介紹太占篇幅，有興趣可訪問Dotnet工具箱-為開發人員提供方便的線上工具 (dotnetools.com)探索使用。
3. 開發部署自己的工具站
it-tools是一個開源項目，站長基於它開發部署了自己的Dotnet工具站，當然您也可以基於it-tools或Dotnet工具站開發部署自己的工具網站，讓我們動起手來試試吧。
3.1. 簡單部署
it-tools項目readme說明有比較詳細的項目相關說明、Docker網站部署步驟，下麵是站長Dotnet工具箱的打包、部署簡單說明：
- 克隆項目：https://github.com/dotnet9/Dotnet9
- 定位到Dotnet工具箱目錄：
./src/Dotnetools - 安裝前端開發必要環境：Node.js
- 終端安裝依賴：
npm install - 終端打包：
npm run build - 複製發佈目錄到伺服器即可。
3.2. 修改或擴展自己的工具
每個小工具源碼在./src/Dotnetools/src/tools/下：
在tools目錄下增加或刪除小工具目錄後，需要改src\tools\index.ts文件，這裡組織工具目錄列表：
3.3. 關於翻譯
部分小工具支持多語言本地化，可在下圖中src\tools\token-generator添加或維護語言：
src\plugins\i18n.plugin.ts配置本地化使用的語言：
但大部分工具是未支持多語言的，可直接在xx.vue或xxx.ts中直接修改語言(比如：src\tools\http-status-codes\http-status-codes.vue)：
Dotnet工具站部分視圖翻譯肯定是存在問題的，歡迎大家提PR糾正。
4. 總結
這些工具站長每個都做了測試，其中JSON 轉 CSV工具有點小問題，沒有正常轉換，得空研究下原因。
因為在家待業時間較多，但難免部分翻譯不正確，歡迎大家參與維護：
參與it-tools開發：https://github.com/CorentinTh/it-tools
參與Dotnet工具箱開發：https://github.com/dotnet9/Dotnet9/tree/develop/src/Dotnetools
糾正Dotnet工具箱中文翻譯、提Issue、提PR都請訪問：https://github.com/dotnet9/Dotnet9
技術交流加群請添加站長微信號：dotnet9com
謝謝您閱讀到這，可以關註【Dotnet9】微信公眾號，一起技術交流、共同進步：
