Node-RED で git 使ってる？

Node-RED の Projects の機能で目についたものをつらつら書いてみる

• Node-RED Projects の公式説明ページ
  • Node-RED : Projects

１．まずは、Projects を有効にして、Node-RED の起動

• 下記のやり方は少し好みが入っているかも。
• 大事な部分は、 settings.js の projects: {enabled: true} を true に編集していところのみ。

echo '{}' > package.json
npm i -D node-red
ln -s node_modules/node-red/red.js red

• ベースとなる settings.js を編集する。
• 後から、ユーザディレクトリ内に作成された settings.js を編集しても良い。

vim node_modules/node-red/settings.js

• settings.js の編集部分とその前後のみを抜粋。

    // Customising the editor
    editorTheme: {
        projects: {
            // To enable the Projects feature, set this value to true
-           enabled: false
+           enabled: true
        }
    },

• Node-RED 起動。

node red -u .

• http://localhost:1880 へアクセスすると、下記画面が表示される。
• とりあえず、 プロジェクトの作成 ボタンを押す。

• git の ユーザ名 、 Email を入力する。

• プロジェクト名 を入力する。
• 今回の例では、分かりやすくするため github のリポジトリ名にする名称を入力する。

• フローファイル名をデフォルトで flow.json が入力されているので、今回は、そのまま使用する。

• 暗号化を有効にするため、鍵を入力する。暗号化用の鍵はおそらくなんでもいい。
• 公式サイトにも説明されているが、認証情報ファイルもパブリックなリポジトリにプッシュするなら、暗号化は有効であるべき。
• Projects とは関係ないけど、複数人、複数箇所などで、フローを作成するときには、その環境毎に認証情報ファイルの内容を適用したいことがある。その場合は、認証情報じゃなくて、環境変数とかにしたいんだよな。ノードの中には、環境変数に対応したものもあって、それ見るとサイコーって感じる。

• 文章なんか読まずに 完了 を押す！

• 上記の通り Node-RED を起動していると、カレントディレクトリがユーザディレクトリになっていて、 projects ディレクトリができているはずである。
• projects ディレクトリ配下の構成は以下の通り。
• README、フローファイル、認証情報ファイル、package.json が作成されている。

projects/
└── try-node-red-projects
    ├── README.md
    ├── flow.json
    ├── flow_cred.json
    └── package.json

２．フローを作成し、コミットしてみる

• 適当に、以下のようなフローを作成してみる。
• 下記では、 http://localhost:1880/page にアクセスすると template に基づいたページが表示される。
• function や template ノードの中は適当に。

• フローを作成し、デプロイを行った後、サイドバー？の git タブ？ へアクセスしてみると、ローカルの変更に、 flow.json が入っている。
• git status みたいなものか。

• コミット履歴を覗くと、プロジェクトを作成した時のものが確認できる。

• 変更をコミット対象にして、そのままコミットしてみる。
• ローカルの変更欄で、 + 全て で対象に追加する。+ で個別に追加しても良い。
• git add . や git add flow.json か。
• 上記操作後、コミット対象に flow.json が入る。
• そうしたら、 コミット を押す。

• テキストエリアにコミットメッセージを入力して コミット 押す。
• git commit -m 'add page' か。

• ローカルの変更は、空になる。そりゃそうだ。

• コミット履歴が増える。そりゃそうだ。

• コミット履歴のリストからいずれかをクリックすると、詳細がぴょこっと生えてくる。

３．github へ push する

• プロジェクトの設定を開く。

• プロジェクト では、プロジェクト名や、READMEの内容が確認/編集できる。

• README の編集はこんな感じ。

• 依存関係 では、インストールしたノード一覧が確認/更新できる。

• github で、空のリモートリポジトリを作成する。

• 設定 では、フローファイル名や、ローカルブランチ、リモートブランチの設定が確認/編集/追加できる。
• リモートを追加 を押す。

• 今回は、 リモート名 はデフォルトで入力されている origin のまま、URL は、 https://github.com/user-name/repository-name を入力する。末尾の .git はあっても無くても良さげ？

• サイドバーに戻って、リモートの master ブランチを作成する。

• ↑プッシュ だ！

• github の認証が要求される。
• リトライ 押すと、（自分のPC環境では、一瞬、間があって、）完了する。

• github を再び訪れると。
• プッシュされてるーーーーー。

４．ブランチの作成

• 先程は master ブランチだったけど、ここで、ブランチの作成もできる。

• 下記の例では、 hogeb という存在していないブランチ名を入力している。
• ブランチの作成 と出てくるので、迷わずクリックする。

• できた〜！

• hogeb ブランチに 有効 が表示されている状態のまま、フローに変更を加えて、コミット、プッシュを行っておく。
• ちなみに、 function ノードのソースコードの diff も見れる！！！！！！！！！

５．github でプルリクとマージする

• おもむろに、プルリク作成する。

• 勢いで、マージする。

• Node-RED に戻って、下記ボタンを押す。（最新の状態になっていなければ。）

• コミット履歴に ↑0 ↓3 のような表示が確認できるはず。
• ↓プル だ！

• こんな選択迫られるけど、無視 で。

６．プロジェクトの取り込み

• 下記画面で、 プロジェクトのクローン を押す。

• 自身の情報を入力する。

• はじめに、 GitリポジトリのURL に、clone する URL を入力すれば、 プロジェクト名 は自動で入力される。
• あれ？ ここの ユーザ名 と パスワード ってなんだっけ？ private リポジトリの場合？
• 認証情報の暗号化キー は、Node-RED で、プロジェクトを作成した時に入力している鍵を入力する。
• プロジェクトをクローン ！

• 無事に取り込まれているよう。
• （認証情報ありのノードを含めておけばよかった。）

• 上記以外の機能は、確認できていない。ローカルの他の git クライアントか、github などのリモートリポジトリで操作して、push なり pull なりする必要がありそう。
• 機能紹介漏れてたら、教えて。

７．所感

• なんといっても、function も含めた diff が良いな。それに尽きる。
• Node-RED から離れず、git の基本操作が GUI できるのはやっぱ便利。
• 複数人でのフロー作成も改善要素多数。（複数人で作成なんてしない？）
• ま、使っていきましょー。