josdejong氏作のJSONエディタを、Electronでデスクトップ用アプリに移植しました。
元のJSONエディタはこちら。めちゃ高機能で便利。
僕が書いたコードはたった200行くらいです。
なぜ作った
- 仕事でイベント用のUnityアプリを作る事が多い
- 現場でパラメータを調整するために、パラメータをJSONやCSVファイルに出しておくことが多い
- SRDebuggerとかでアプリ内に設定画面を作る事も多いけど、その時間すらない事もある
- プログラマー的にはJSONを使いたい
- 普通の人が使えるJSONエディタがほしい
- オンラインJSONエディタは良い奴がたくさんある
- exeで欲しいんだが！！！
- Electronでラップしたら良いのでは？
- Electron最近触ってないし、勉強がてら作ってみるか〜〜
- できた
インストール方法
最新のリリースページからzipファイルをダウンロードしてください。 zipファイルを解凍するとアプリ本体が出てくるので、適当な場所に保存すればインストール完了です。
https://github.com/fand/json-editor-app/releases/latest
Macの場合は「開発元が未確認のため開けません」と表示されてしまうので、初回の起動時は以下の手順で起動してください。
- アプリを右クリックしてメニューを表示し、「開く」をクリック
- 確認ウィンドウが表示されるので、もう一度「開く」をクリック
- 起動成功！
2回目以降は普通にダブルクリックで起動できます。 詳しい解説はこちら: https://nori510.com/archives/14288
.json ファイルとの関連付け
JSONファイルを開く際に、JSON Editorで開くようにしておくと便利です。
Windows
- エクスプローラーで適当なJSONファイルを右クリックし、「プログラムから開く」をクリック
- 「常にこのアプリを使ってファイルを開く」にチェックを入れる
- 「このPCで別のアプリを探す」をクリック
JSON Editor.exeを選択- 完了
Mac
- Finderで適当なJSONファイルを右クリックし、「情報を見る」をクリック
- 「このアプリケーションで開く」をクリックし、「その他」を選択
JSON Editorを選択- 「このアプリケーションで開く」の下の「すべてを変更」ボタンをクリック
- 完了
使い方
適当にボタンを押してみてくれ
しくみ
- Electronでラップしてるだけで
- electron-forgeを使った
- TypeScriptでElectronアプリの雛形を作ってくれて便利
- アプリのパッケージングとかAuto updateとかも面倒みてくれる
- とはいえ、ハマりどころも色々あった
- 素直にelectron-builder使った方が楽かもしれん
- 今回はAuto updateには対応していない
- Code signing周りが面倒なので……
- josdejong/jsoneditorが管理してるDOMに無理やりボタンを挿入してたり、実装がメッチャ雑
- 僕はちょっとしかコード書いてないしまあエエやろ……
- 元のライブラリがまあまあ枯れてるので、そこまでメンテしなくても動くはず
たぶん便利なので良ければ使ってみてください🙏
