RasDashを使ってみた

RasDashは「メモリやCPU使用率、センサの値などを表示するNode.js製ダッシュボード」です。
MOON GIFTさんの「RasDash - Raspberry Pi用のダッシュボード」という記事を見て、面白そうと感じたので、使ってみました。

導入

下記の手順で導入。最後のsystemctl enable RasDash.serviceは自動起動するために入力しただけなので、実行しなくても問題なし。

$ git clone https://github.com/sykeben/RasDash.git ~/RasDash
$ cd ~/RasDash/
$ sudo ./install_deps
$ sudo ./service_manager install
$ sudo ./service_manager start
$ sudo systemctl enable RasDash.service

表示

http://<Raspberry piのIPアドレス>:5808/dash/0をブラウザで表示。
各値はリアルタイムに反映される。

ポート変更

デフォルトでは、ポート番号5808へ接続している。
~/RasDash/config.jsonに記述された数値を変更すれば、他のポート番号に変更できる。
なお、変更後すぐに動作を確認したい場合は./service_manager restartコマンドをRasDashディレクトリ上で実行する。

{
    "port": 5808
}

表示内容変更

ダッシュボードに載せる情報は下記のファイルで変更可能。

表示するボードの順番を修正

編集対象：~/RasDash/views/pages/dash_0.ejs

通常のHTMLの編集と同様に、対象のタグ群を入れ替えるだけで順番を入れ替えられる。

ページ上部のタブに項目追加

編集対象：~/RasDash/views/partials/navbar.ejs

<!-- Pages -->の下にページを切り替えるタブを表示するコードがあるので、ここに新しいページを記載。
<a>要素に関連付けられたidは、~/RasDash/public/javascript/navactive.jsでも利用されているため、必要に応じてこちらも変更。
下記の例ではDashboard2が追加されている。

<nav class="navbar navbar-expand-lg navbar-dark bg-dark navbar-shadow">

    <!-- Brand -->
    <div class="navbar-brand text-danger">
        <img class="mr-n2" height="32px" src="/images/icon-sm.png">
    </div>

    <!-- Pages -->
    <div class="navbar-nav">
        <a id="nav-link-0" name="nav-link" class="nav-item nav-link" href="/dash/0">Dashboard</a>
        <a id="nav-link-1" name="nav-link" class="nav-item nav-link" href="/dash/1">Dashboard2</a>
        <a id="nav-link-2" name="nav-link" class="nav-item nav-link" href="/about">About</a>
    </div>

    <!-- Active Manager -->
    <script type="text/javascript" src="/javascript/navactive.js"></script>

</nav>

さいごに

htmlやjavascript、cssの知識はもちろん、EJSというNode.jsのテンプレートエンジンに関する知識が必要なようです。

RasDashの他の項目をいじれるよう、暇を見つけていろいろ試してみます。