VIRONとは？
VIRONはCA Mobileというサイバーエージェントの子会社が作った管理画面を簡単に作成できるOSSです。
「Viron（ヴァイロン）」は、API仕様を定義する際のフォーマットとして使われることの多い「OpenAPI Specification 2.0」を包括し、統一された質の高いデザインと操作性を持つ管理画面を提供します。
- 全ての管理画面開発に悩めるエンジニアに捧ぐ 〜Viron誕生〜
- シーエー・モバイル、Web、ネイティブアプリなどの管理画面の開発を包括的にサポートする「Viron（ヴァイロン）」をオープンソースとして公開
APIのフォーマットはSwaggerを使ってyaml形式で比較的簡単に書くことができます。結論めちゃくちゃ少ない工数で管理画面を実装できました！しかも綺麗なデザインが当てられているのでしっかり作れた印象をプロデューサーなどに印象づけることができます笑
仕組み
仕組み自体はすごくシンプルです。SwaggerでAPIのインターフェースを決めてそのインターフェースに基づいてフロントエンドのVIRONがVIEWを自動で生成してくれます。なので開発者は下記２点のみを準備することで管理画面を作成できます。
- SwaggerでAPIインターフェースを作る
- VIRONとAPIインターフェースに沿ってAPIサーバを実装する
Swaggerは今回初めて使いましたが特に難しいこともなく半日くらいいじってれば理解できます。まあ、ただのyamlを書くだけなので。
改善したいところ
フロントエンド側のVIRONは問題ないと思います。問題はVIRONを使うためのデモアプリのわかりづらさですかね。ここの実装をもっとわかりやすく紹介できるようになると使うプロジェクトが一気に広がりそうですね。例えば
- デモのNode.jsサーバーのソースコードが散らかってる
- サーバーの設定が複数ファイルに分散されてしまっていて把握しづらい（config、.env、swagger.yaml）
問題はAPIインターフェースに沿ってAPIサーバを実装するところですね。APIサーバを実装するだけと言ってもゼロから実装するのはめんどくさいのでVIRONが用意してくれたデモサーバの実装を丸パクリします。そのデモではすぐに実装が始められるようにnode-vironlibというnpmモジュールを別途実装していてそれを使っているのですがデモサーバとこの組み合わせがわかりづらくて最初苦戦しました。
それでも触り始めて３、４日でこんな管理画面を実装し切りました。
まとめ
今回は使った感想みたいになりましたが次回は導入方法とか実装方法を紹介したいと思います。
あと、VIRONはとりあえず管理画面作るなら試してみてください。絶対工数削減できるので！！
髙妻智一
最新記事 by 髙妻智一 (全て見る)
- Polkadot(Substrate)のアドレスとトランザクションについて - 2023-03-09
- 【無料公開】「Goで始めるBitcoin」3章 Bitcoinノードとの通信 技術書典8 - 2020-03-08
- エンジニアがゼロから技術ブログを書くための方法をまとめました - 2019-05-25
コメントを残す