はじめに
フロントエンドやバックエンドの開発で、JSONの整形やJWTのデバッグ、CSSシャドウの微調整など、日常的にオンラインツールを使う場面は多いと思います。
しかし、会社の機密トークンや本番ログ、個人情報(PII)を**「出所不明のWebツールにコピペしてサーバー送信すること」**にセキュリティ上の不安を感じたことはないでしょうか?
そこで、すべてのデータ処理をブラウザ(WebCrypto・メモリ内)で完結させ、外部通信を一切発生させないプライベート開発ツールボックス**「MiniToolDesk」**を個人開発しました。
🔗 Webサイト(日本語対応・完全無料): https://minitooldesk.com/ja/
💻 GitHub(コアSDK): https://github.com/minitooldesk/minitooldesk-core
既存ツールとの比較
| 項目 | 一般的なWebツール | MiniToolDesk |
|---|---|---|
| データ処理 | 外部サーバーへ送信して処理 | 100% ブラウザ内(ローカル)完結 |
| セキュリティ | 情報漏洩・ログ保存リスクあり | 外部通信ゼロ(機密トークンも安全) |
| 広告・ポップアップ | 画面いっぱいの広告で重い | 広告ゼロ・完全クリーン |
| オフライン動作 | ネット必須 | PWA対応・オフラインでも動作 |
| 利用料金・登録 | 会員登録や有料プランあり | 登録不要・完全無料 |
注目の便利ツール(抜粋)
1. ⚡ フロントエンド開発・データ変換
- JSON to TypeScript: JSONオブジェクトをTypeScriptのinterface型定義へ瞬時に自動生成
- JSON Formatter & Validator: 数万行の巨大JSONもブラウザ内Web Workerで高速整形
- Code Snippet to Image: Twitterやドキュメント用の美しいコード画像をワンクリック作成
2. 🎨 CSS・ビジュアルデザイン
- CSS Box Shadow: 多層シャドウをスライダーで直感的に調整、CSS/Tailwindコードを出力
- Glassmorphism: 流行りの磨りガラス風UI(backdrop-filter)のコードジェネレーター
- SVG Wave Generator: サイトの区切りに使える滑らかな波形SVGをリアルタイム生成
- CSS Loader: コピペですぐ使える軽量ローディングアニメーション集
3. 🔒 セキュリティ・暗号化
- JWT Debugger: 認証トークンを外部APIに送らず、ブラウザ内でデコード・署名検証
- Hash Calculator: WebCrypto APIを使い、SHA-256 / SHA-512 / MD5を安全に算出
- Base64 / URL Encoder: 完全ローカルでの高速エンコード・デコード
技術的なこだわり(プライバシーの検証方法)
「本当にサーバーへデータを送っていないのか?」と疑問に思う方もいるかもしれません。
ブラウザの デベロッパーツール(F12)の「Network(ネットワーク)タブ」 を開いた状態でツールを使ってみてください。
ツール実行時に入力データを送信するようなHTTPリクエストは一切発生しません。ページの読み込み後は、Wi-Fiを切断した完全オフライン状態でも問題なく動作します。
- フロントエンド: Next.js 14 (App Router) + Tailwind CSS
- 計算エンジン: WebCrypto API, Canvas API, Web Workers
- 多言語対応: 日本語を含む7言語に対応
おわりに
ブックマーク(Ctrl + D / Cmd + D)に入れておくと、日々の開発作業でちょっとした作業がかなり快適になると思います。
「こんなツールを追加してほしい」「ここが使いづらい」など、ご意見・フィードバックがあればぜひコメント欄やGitHub Issueでお気軽に教えてください!
👉 使ってみる: https://minitooldesk.com/ja/