Node-REDを使ってクラウドネイティブアプリケーションを構築する

Node-REDを使用したクラウドネイティブアプリケーションの構築

萩野たいじ氏（以下、萩野）：去年開かれたNodeConf EU2019でNode-REDの開発者であるNick氏が「Node-REDを使用したクラウドネイティブアプリケーションの構築」について登壇をした内容のリキャップをしてほしいという要望がありましたので、私がそれをやらせていただくという内容になります。

彼がNickです。実は僕と彼は同じDeveloper Advocateチームで、同僚になります。

萩野：今回「Nickのプロフィールを紹介したいからプロフィールをくれ！」と、10日ぐらい前に投げたんですけど、結局レスポンスがなかったので、プロフィールはこれだけです。この@knollearyはNickのTwitterのハンドルなので、よければフォローをしてください。

私はIBMでDeveloper Advocateをしています。それと先ほどIBM Championの話が出たと思うんですけど、今日も何名かIBM Championの方がいらっしゃいまして、僕はIBM Champion Programで、これはIBM Corporation、USのプログラムなんですけど、JapanリージョンのRegional Director、いわゆる事務局ですね。そこも担当させていただいております。

あとは筑波大学で非常勤講師をやらせていただいております。『はじめてのNode-RED』など、本も何冊か書いています。『月刊I/O』の連載は、このコミュニティのユーザグループのメンバーと一緒に書いています。最後に1つ、僕はDeveloper Advocateの仕事もしているんですけど、DevRel（Developer Relations）をずっとやっています。DevRelの本も書いています。

ソーシャルはFacebook、Twitter、LinkedInで@taiponrockというアカウントでやっているので、フォロー、友達リクエストはお気軽にと言うところなんですが、Facebookはできればコメント付きでリクエストしていただけるとどこでお会いした方かとかがわかるのでありがたいです。

ということで、よろしくお願いします。

Developer Advocateチームは国を跨いで1つのチームなんですね。その中で東京のメンバーは8名になります。いろんなイベントに顔を出しているので見かけた際は、お気軽に声を掛けてくれれば、みんな快く対応してくれると思うので、よろしくお願いします。

Node-REDとは？

リキャップセッションをやってほしいということで、僕もちゃんと内容を確認しないまま「いいですよ！　やります！」とか言ったんですけど、実はNickがやったセッションはハンズオンワークショップでした。

前半は座学でスライドを使ってやっているんですが、こういうNode-REDを知らない人向けの基礎的な内容を紹介しているスライドになります。ですので、今日参加している方のどのぐらいの割合かはわからないですけど、Node-REDをガンガン使っている人にとっては今更という内容かもしれません。そこはご了承いただいて聞いていただければと思います。

「Node-REDって何？」ということを知らない方もいらっしゃると信じてやります。IoTとインテグレーションしている多くのアプリケーションでは、いろいろなAPIやオンラインサービスをさまざまなかたちで最適な方法でまとめる・つなぐ必要があるということで、これを容易にしてノードで連携を取ってデータのやりとりをするために作られたビジュアルプログラミングという位置付けのものです。

「イベント駆動型アプリケーション向け」と言っているんですが、今ではフローベース・プログラミングツール、ノーコード・ローコードの文脈で語られることが多いです。

Node-REDの生い立ち

今更感があるんですけど、ちょっと生い立ちを説明します。すべてNickの資料を日本語化して、そのままトレースしたかたちです。

Node-Redは2013年に始まって、2015年にはRaspberry Piのデフォルトイメージに追加されたり、2016年にJS Foundationのプロジェクトになったり、2018年には100万インストールを記録しました。2019年には、Node.js FoundationとJS Foundationが合併して新たにOpenJS Foundationの配下になりました。こんな歴史をたどっています。

開発はIBMですが、オープンソースとなっています。別にIBMの環境で動くものというわけではなくて、Node.jsのランタイム上で動くので、Node.jsが動く環境であれば基本的にはどこでも動くという非常に便利なツールになります。

Node-REDのインタフェース

次に、画面の説明をします。これはNode-REDの画面ですね。まず左側にある箱がノードです。これも一つひとつの箱にそれぞれ異なる処理が既に実装されて詰まっている状態ですね。この箱を置いてあげれば、その箱の中の処理を実行させることができます。これがノードですね。

フローは、その箱を並べて線でつなぐ。そうすると処理が順番に実行されます。非常にわかりやすいですよね。たくさんのノードが公開されています。主要なAPIの呼び出しや、よく使われる処理については、いろんな人が作ってすでに公開していることが多いです。

例えば、IBMのAPIであるWatsonの呼び出しに関しては、IBMがWatson用のノードを予め作って提供していたりもします。実はAzure向けのノードも公開されています。そんな感じで非常におもしろいですね。

ノードをダブルクリックすると画面に設定パネルが表示されます。デプロイボタンが右上にありまして、ノードを並べたり線でつないだり、ノードの設定値を変えたりノードの中に直接コーディングをしたりしたときに、最後はデプロイボタンを押します。デプロイボタンを押すと作業したものがサーバに反映されます。

こちらはメニューです。右上に3本線のいわゆるハンバーガーメニューですね。いろんなフローの削除やインポートを、ここから行うことができます。ざっくりとこの辺を覚えておけば、とりあえず使い始められます。

まだ使ったことがない人は使ってみるところからやってみるといいかと思います。

Node-REDテクニカルオーバービュー

テクニカルオーバービューということで、アーキテクチャの説明をします。Node-REDには2つの論理パーツがあります。1つがランタイム、1つがエディタです。（スライドの）右側の図を見るとわかりやすいです。ランタイムの上にNode.jsのWebアプリケーションがあって、フローエディタが存在しているという作りになっているんですね。

フローの説明です。フローは処理をまとめた箱を並べて線（ワイヤ）でつなぎます。それで処理を流す。このまとまりをフローと言います。

あとはメッセージですね。このフローの中を、データを受け渡して次に次にと進んでいくんですけど、これがメッセージと呼ばれているものです。JavaScriptの情報をJSON形式で指定して次に渡しています。

ノードです。ノードはフローの基本的な構成要素の一つひとつの種類ですね。接続しているノードにメッセージを渡します。ノードはメッセージを受信し、作業・処理を行ってから、次のフローにデータを渡します。

Node-REDをハンズオン

みなさん左下にURLが見えていると思います。この「https://ibm.biz/NRWorkshop」のURLの内容について、Nickの講演ではハンズオンを行いました。

ハンズオンワークショップのメニューはこんな感じになっています。まずはNode-REDを始めてみる。そのあとにクラウドの環境を作って、クラウドにアプリケーションをデプロイするという流れです。パート4とパート5でつながってはいます。ただ、（このセッションの）残り時間でパート1からパート5まで全部解説するわけにはいかないんですよ。

実はクラウドの環境を作って、要はアカウントを作ってクラウドにパート1で作ったアプリケーションをデプロイしていきましょうという流れなので、パート1だけ説明していきたいと思います。

サンプルアプリとしてToDoアプリを作ります。いToDoを入れたり消したり更新したりすることができるアプリです。一応このTodoMVCというフレームワークを使って作られております。サーバーサイドもTodo-Backendを使って構成されている簡単なWebアプリです。

ここで先ほども（別のセッションで）紹介がありましたプロジェクト機能が使われています。これが全体のフローです。ということで、画面をざっと動かします。

これがワークショップの内容で、単純にステップバイステップで手順が書かれています。実はGitHubにはまだ英語版しかありません。僕のほうで今ローカライズを進めています。

READMEが日本語化でき次第プルリクしてマージしてもらう予定ですね。それまでちょっとお待ちください。

先ほどのこのプロジェクト機能を使って、リポジトリからフローを引っ張ってきて、向こうにデプロイしています。ポイントはここでローカルのスタンドアロンのNode-REDで動かしているんですけど、データベースにつなぐんですよね。

データベースにつなぐのですが、今回はCouchDBを使っています。CouchDBの中にtodosというデータベースを置いて、そこにToDoリストで作ったメッセージを入れていきます。もう本当にそれだけです。なので、ローカル環境にプロジェクトを引っ張ってきて、CouchDBを立てて、これだけ。Cloudantノードの中の設定で、ここのサーバを、自分のCouchDBのデフォルトで5984で設定されるので、ユーザーネームとパスワードを入れれば動きます。

もう、本当はこの細かいsetting.jsの内容とかも解説しようと思ったんですけど、もう解説してくれたので省略します。

田中：連携ですね（笑）。

萩野：setting.jsの中にテーマ要素があるので、テーマ要素の中でプロジェクトをtrueにしてあげるということですね。もう一つのポイントとしてはローカルホストの127.0.0.1のポートが1880でadminのパスを取っているんですね。

なので、実はここはフローエディタの起動をするパスを1個ずらしています。なぜならば、ここでデプロイしたToDoアプリがローカルホスト1880で動かしているからです。

ここでNode-REDがあると、バッティングしてしまうので、フローエディタをadminのパスに1個ずらしてあげて、1880……ローカルホストの直下にこのToDoアプリを実行するというかたちでやっています。

最後にTodoに「てすと」と入力して、データベースの中身を見てみましょう。

田中：じゃじゃん！

萩野：入ってますね。データを消してみると、消えているという感じです。

田中：おぉー。すばらしい。

萩野：これでこのワークショップのラボ1ですね。ワークショップのラボ1をやっていただくと、このToDoアプリを一通り作れます。とても簡単なのでみなさん試してください。

では、以上になります。