フォルダ検索ツール｜画像生成と会話するAIの魅力と可能性
https://note.com/chat_gpt777/n/nfaa255fc1dfd
メモ書き、ID、パスワードの覚書、メールの下書き、文書を考えるときの下書きなどでテキストエディタを利用して、作成している。そんなたくさんのファイルを「雑文書」として一括保存している。その中から探し出すのは至難の業、エクスプローラーの検索エンジンでもなかなか見つからない。そこで検索ツールを作ってみた。
📁 フォルダ検索ツール - 完全ガイド
概要
パソコン内の指定したフォルダとそのサブフォルダ内にあるテキストファイルを再帰的に検索し、一覧表示・内容確認・保存ができるWebアプリケーションです。
主な機能
1️⃣ フォルダの再帰的検索
選択したフォルダ内を自動的に探索
サブフォルダ（フォルダの中のフォルダ）も全て検索
対応ファイル形式：.txt, .md, .json, .csv, .log, .xml, .html, .css, .js
2️⃣ ファイル一覧表示
見つかったファイルを見やすいカード形式で表示
ファイル名とフルパスを表示
検索結果の件数をリアルタイムで表示
3️⃣ リアルタイム検索・絞り込み
検索ボックスでファイル名やパスを即座に絞り込み
入力するたびに結果が更新される
4️⃣ ファイル内容の全文表示
ファイルをクリックするとモーダルウィンドウで全文表示
長いファイルもスクロールして読める
モーダルの外側クリックまたは×ボタンで閉じる
5️⃣ 保存機能（2種類）
一覧を保存: 検索結果をCSV形式でダウンロード（Excelで開ける）
個別ファイル保存: 表示中のファイル内容をテキストファイルとしてダウンロード
6️⃣ クリア機能
検索結果をリセットして初期状態に戻す
使い方
ステップ1: フォルダ選択
「フォルダを選択」ボタンをクリック
パソコン内の検索したいフォルダを選択
ブラウザがフォルダへのアクセス許可を求めるので「許可」をクリック
自動的に検索が開始される
ステップ2: 結果の確認
検索完了後、見つかったファイルが一覧表示される
画面上部に「○○個のテキストファイルが見つかりました」と表示される
ステップ3: 絞り込み（オプション）
検索ボックスにキーワードを入力して結果を絞り込む
例: 「report」と入力すると、ファイル名やパスに「report」を含むものだけ表示
ステップ4: ファイル内容の確認
一覧のファイルをクリック
モーダルウィンドウが開いて全文が表示される
ステップ5: 保存（オプション）
一覧全体を保存: 「一覧を保存」ボタン → CSV形式でダウンロード
個別ファイルを保存: ファイルを開いた状態で「このファイルを保存」ボタン
技術仕様
使用技術:
HTML5 + CSS3 + JavaScript（バニラJS）
File System Access API（ブラウザの標準機能）
非同期処理（async/await）
対応ブラウザ:
✅ Google Chrome 86以降
✅ Microsoft Edge 86以降
✅ Opera 72以降
❌ Firefox（File System Access API非対応）
❌ Safari（File System Access API非対応）
セキュリティ:
ユーザーの明示的な許可なしにファイルにアクセスできない設計
選択されたフォルダ内のみアクセス可能
HTTPSまたはlocalhost環境で動作
利用シーン
✅ 大量のテキストファイルを管理している場合
ドキュメント、ログファイル、設定ファイルなどの整理
✅ 特定のファイルを素早く見つけたい場合
プロジェクト内のREADMEやドキュメントを検索
✅ ファイル一覧をExcelで管理したい場合
CSV出力でファイルリストを作成・共有
✅ 複数のサブフォルダにまたがるファイルを確認したい場合
階層構造を意識せずに全ファイルを一覧化
制限事項
ブラウザ依存: Chrome系ブラウザのみ対応
テキストファイルのみ: 画像や動画、バイナリファイルは表示不可
大量ファイル: 数千個以上のファイルがある場合、検索に時間がかかる可能性
権限: システムフォルダなど一部のフォルダはOSの制限でアクセスできない場合あり
このツールは、ファイル管理を効率化し、必要な情報に素早くアクセスできるように設計されています！
フォルダ検索ツール
https://pasopia.velvet.jp/2025/soft/index0115.html
