✅ はじめに
「ブラウザだけでコードのバージョン管理ができたらな…」
「Gitを使うほどじゃないけど、履歴を残したい」
そんなあなたのために、Vue.js CDNだけで完結するバージョン管理エディタを公開しました!
インストール不要・完全無料・スマホでも動く軽量設計です。
🔧 主な機能
| 機能 | 内容 |
|---|---|
| 複数ファイル管理 | GUIでいくつでもファイル作成&一覧表示可能 |
| 自動バージョン管理 | 3秒間編集が止まると自動でバージョンを保存(Undo/Redo感覚) |
| ローカルストレージ保存 | データはブラウザに自動保存。リロードしても保持される |
| 前へ / 次へボタン | 各ファイルごとに履歴を自由に移動可能 |
| 手動保存ボタン | 明示的に「今の状態を記録」したいときに便利 |
🎮 実際の使い方
- ファイル名を入力して「ファイル作成」ボタンをクリック
- エディタで内容を編集(3秒後に自動保存)
- 必要なら「前へ」「次へ」で履歴を移動
- 「手動保存」で今の状態を明示的に残すことも可能
🧠 技術構成
- Vue.js 3(CDN)
- Tailwind CSS(CDN)
- ローカルストレージ
- SPA構成でリロードにも強く、追加ライブラリ不要
📦 コード全文(コピペで動く)
👉 コードはこちらの記事内に全て掲載!
ブラウザにコピペするだけで即動きます。
📈 想定ユースケース
- コーディング授業や勉強会のメモ取り
- 設定ファイルやドキュメントの試行錯誤履歴保存
- Gitの代わりに使いたい初心者や非エンジニア向けの簡易版
🌱 今後のアップデート予定
- フォルダ構造による階層管理
- バージョンにコメントをつける機能
- diff表示(バージョン間の変更点確認)
- zip一括エクスポート
