基本

ここでは、続ける前に把握しておくべきNoodlのいくつかの基本的な概念について学びます。以下のビデオを視聴するか、短いガイドを確認してください。

note

このビデオは、Noodlの非推奨の商用バージョンからのもので、オープンソースバージョンには存在しないいくつかの機能、特にワークスペースと組み込みのGitホスティングを含んでいます。

ノード

Noodlの主要な構成要素はノードです。各ノードにはそれぞれ特定の目的があり、それ自体では非常にシンプルですが、一緒になると非常に強力になります。ノードの種類はその色によって示されます。青のノードは、ボタンなどの視覚的要素や、グループなどすぐには見えないが関連する要素です。緑のノードは一般にデータの読み書きや操作に関連しています。灰色のノードはユーティリティであり、ピンクのノードはカスタムコードに関連しています。

入力と出力

すべてのノードには入力と出力があります。2つのノードを接続するのは、一方のノードをクリックし、もう一方のノードに接続をドラッグして、どの出力をどの入力に接続するかを選択するほど簡単です。ノードグラフでデータの流れを視覚的に確認でき、接続をクリックするとどのようなデータが渡されているかを確認できます。

Noodlのほとんどのプロパティは接続可能であり、それが非常に強力で創造的に活用できる理由です。

接続タイプ

Noodlには、データとシグナルの2種類の接続タイプがあります。

• データ：これは、テキスト入力の内容や変数など、あるノードの出力値を別のノードの入力に接続します。これは、ユーザーインターフェイスにデータを表示するために一般的に使用されます。データが接続を通じて渡されると、ノードグラフでそれが光るのが見えます。

• シグナル：アプリに何らかのアクションを実行させたいときは、シグナル接続を使用します。ノードには、ボタンのクリックなど、特定のイベントでトリガーされるいくつかのシグナル出力があり、別のノードのシグナル入力に接続されます。受信ノードは通常、シグナルを受け取ったときに実行される何らかのアクションです。シグナルがトリガーされると、ノードグラフでそれが光るのが見えます。

タイプ変換

データとシグナルを直接接続することはできませんが、接続タイプを変換できるノードがあります。たとえば、値が変更されるたびにシグナルをトリガーしたい場合などです。

コンポーネント

ノードと接続のクラスターをコンポーネントにグループ化できます。これらのコンポーネントは、新しいノードグラフで組み合わせられ、さらに大きなコンポーネントの一部になることができます。大規模なアプリでは、アプリケーションを整理するために多くの異なるコンポーネントを作成します。これらのコンポーネントは、組み込みのノードと同様に、独自の入力と出力を持つことができます。これは、アプリケーション全体でUIやロジックを再利用する素晴らしい方法です。

コンポーネントはまた、複雑な機能を抽象化してカプセル化する素晴らしい方法です。コンポーネントが持つプロパティと、外部の世界に公開されるプロパティを決定できます。APIのようなものです。

コンポーネントタイプ

コンポーネントには4つのタイプがあります：ページ、ビジュアル、ロジック、クラウドファンクション。

• Page：ページコンポーネントはアプリの画面であり、ページルーターノードを使用してナビゲートできます。

• Visual：ビジュアルコンポーネントは、画面上にUI要素をグループ化してレンダリングするために作られています。ロジックを含むことができますが、主な出力は常に何か見えるものです。

• Logic：ロジックコンポーネントは、アプリの脳です。これらは、画面上に何もレンダリングしないノードをグループ化するために使用されます。データ変換を行う数個のノードから、渡された値に基づいて異なる出力にシグナルをルーティングするようなものまで、シンプルなものから複雑なものまであります。

• Cloud Function：クラウドファンクションコンポーネントは、クラウドで実行されるロジックコンポーネントであり、データを扱います。フロントエンドで実行できないタスクを行ったり、他のロジックコンポーネントを含むことができます。

どこでも更新

コンポーネントに非常に実用的なことの一つは、それらがグローバルであるということです。つまり、コンポーネントの内部を更新すると、アプリ内でこのコンポーネントが使用されているすべての場所でこれらの変更が更新されます。