JSON Editor

「Hello World」と「Counter」アプリの基本のいくつかをカバーしたので、より複雑なものを構築して管理する準備が整いました。

このチュートリアルでは、キーと値のペアを入力するためのシンプルなインターフェースをユーザーに提供するアプリケーションを作成します。このペアは変換され、JSON で stdout に出力されます。このアプリケーションの目的は、カンマや括弧自体を気にすることなく、正しい JSON を作成するためのインターフェースをユーザーに提供することです。

これを実行するとどのようになるかを示した GIF を以下に示します。

Demo

初期化

先に進んで、新しいRustプロジェクトをセットアップします

cargo new ratatui-json-editor

Cargo.toml に以下を置きます。

[dependencies]
ratatui = "0.29.0"
serde = { version = "1.0.215", features = ["derive"] }
serde_json = "1.0.133"

またはこれらのライブラリの最新バージョン。

ファイル構造

src/ の内部に2つのファイルを作成すると、次のようになります。

src
├── main.rs
├── ui.rs
└── app.rs

これは、 ratatui の小さなアプリケーションへの一般的なアプローチに従います。ここでは、状態ファイル、UIファイル、およびメインファイルをすべて結び付けます。