最初から読む場合は以下の記事からスタートしてください。ユーザインタフェースを構築するためのアプリケーションアーキテクチャです。状態管理についての手法を持ち合わせておリません。レイヤのフレームワークであるからです。ブラウザ等のクライアント側で行ってあげる必要があります。実現するために状態管理の手法までを含めた、フレームワークでは無い、アプリケーションを開発するための設計パターンです。思想ベースの他のフレームワークを使用してアプリケーション開発をするといった選択肢も取ることができます。アプリケーションをイメージしてもらえるとわかりやすいと思います。件の状態で表示されます。ブラウザの画面に表示されます。件として画面上部に表示されるます。件と表示していることです。件をそのまま表示してしまうことになります。コード的に見ていきましょう。使い画面をレンダリング機能はありますが、状態を保存したり引き出したり変更したりといったことが簡単にできるといった思想で作成されてはいません。コンポーネントを既に書いているはずです。持っており、その自身のデータを表示します。更新することができています。整合性を保とうとして、コードが複雑になったり保守性が低くなったりと色々な弊害が発生しかねません。データ構造に着目すると、それ自体は次のようなシンプルなオブジェクトになっています。件だった場合、初期状態としては例えば以下のように表せます。次のような状態になります。等で建てられるようになってきてきました。ブラウザ側で現在の未読件数が何件なのか、状態を管理しておく要求が出てきました。状態管理と、その状態のレンダリングの一連の流れを以下のように図示しています。している場合もあります。変更が合った時にその値で自分自信を新しい情報でレンダリングします。発行するデータとしては以下のようなものになります。コードで表すと、次のようなイメージになります。データと処理を渡した後、裏側でどんなに複雑な処理をしていようと、それについては意識する必要がありません。サーバ等にアクセスして必要なデータを処理したり、計算処理をする役割を持っています。なり、シングルトンパターンが使われることが多いです。レンダリングするためのデータを格納する役割を持っています。自身のデータが更新されるという流れが一般的です。レンダリングされます。発生させる役割を持っているものもあります。変更を検知してその値をレンダリングすれば良く、バックエンド側と綺麗に切り離されているため分業も簡単になります。データの流れが一方通行になりシンプルになるため、バグの少ないアプリケーション作成にも期待が持てます。ここで各コンポーネントの概要の説明は完了しました。思想に沿ったアプリにしていくことでこの思想について勉強していきたいと思います。ソースコードプロジェクトの作成それでは、新しいプロジェクトを作成し構築していきましょう。チュートリアル開始時点でのソースコードは以下のリポジトリにもあるので、参考になればと思います。パッケージもインストールしておきます。作成し、以下のように記述します。記述を移すことも可能です。作成していきますが、量が多いため割愛します。以下のリポジトリにファイル一式が用意されているので、それを使用していきます。起動して初期画面が表示されることを一旦確認してみましょう。アクセスし、トップページが表示されることを確認してください。思想に従って適切な場所へと置き換えていきます。