メインコンテンツへスキップ

Redux FAQ: 一般

Reduxを学ぶべきなのはいつですか？​

JavaScript開発者にとって、何を学ぶべきかというのは圧倒的な疑問となりえます。一度に一つのことを学び、自分の仕事で見つけた問題に焦点を当てることで、選択肢の幅を狭めるのに役立ちます。Reduxはアプリケーションの状態を管理するためのパターンです。状態管理に問題がない場合、Reduxのメリットを理解するのが難しいかもしれません。一部のUIライブラリ（Reactなど）には、独自のステート管理システムがあります。これらのライブラリのいずれかを使用している場合、特にそれらの使い方を学び始めたばかりの場合は、まずその組み込みシステムの機能を学ぶことをお勧めします。それはアプリケーションを構築するために必要なすべてかもしれません。アプリケーションが複雑になり、状態がどこに保存されているか、または状態がどのように変化するかがわからなくなった場合は、Reduxを学ぶ良い機会です。

ヒント

ほとんどの新しい学習者は、まずReactを学ぶことに集中し、Reactに慣れてからReduxを学ぶことをお勧めします。そうすることで、一度に学ぶ新しい概念が少なくなり、どの概念がReactの一部であり、どの概念がReduxの一部であるかがより明確になります。また、Reduxの使用がReactアプリにどのように適合するか、およびReduxがなぜ有用であるかをよりよく理解できるようになります。

詳細情報​

記事

ディスカッション

Reduxを使うべきなのはいつですか？​

すべてのアプリがReduxを必要とするわけではありません。構築しているアプリケーションの種類、解決する必要のある問題の種類、および直面している問題を最適に解決できるツールを理解することが重要です。

Reduxは共有状態の管理に対処するのに役立ちますが、他のツールと同様に、トレードオフがあります。コードを記述する最短または最速の方法として設計されたものではありません。それは、「特定の状態のスライスがいつ変更されたのか、データはどこから来たのか？」という質問に、予測可能な動作で答えることを目的としています。学ぶべき概念が増え、記述するコードも増えます。また、コードに間接性が追加され、特定の制限に従うように求められます。これは、短期的な生産性と長期的な生産性のトレードオフです。

Reactの初期貢献者の1人であるPete Huntが述べているように

Fluxが必要なときはわかります。必要かどうかわからない場合は、必要ありません。

同様に、Reduxの作成者の1人であるDan Abramovは次のように述べています。

これを修正したいと思います。Reactのバニラで問題が発生するまでReduxを使用しないでください。

Reduxは、次のような場合に最も役立ちます。:

  • アプリ内の多くの場所で必要となる大量のアプリケーション状態がある場合
  • アプリの状態が頻繁に更新される場合
  • その状態を更新するロジックが複雑な場合
  • アプリのコードベースが中規模または大規模で、多くの人が作業する可能性がある場合
  • その状態が時間の経過とともにどのように更新されているかを確認する必要がある場合

Reduxと同じ問題を解決するのに役立つ他のツールもたくさんあります。状態管理、フェッチされたサーバーデータのキャッシュ、UIを介したデータの受け渡しなどです。

情報

Reduxがアプリに適した選択肢であるかどうかわからない場合は、これらのリソースがさらにガイダンスを提供します

結局のところ、Reduxは単なるツールです。優れたツールであり、使用する優れた理由もありますが、使用したくない理由もあります。ツールについて情報に基づいた決定を下し、各決定に関わるトレードオフを理解してください。

詳細情報​

ドキュメント

記事

ディスカッション

ReduxはReactでのみ使用できますか？​

Reduxは、任意のUIレイヤーのデータストアとして使用できます。最も一般的な使い方はReactおよびReact Nativeですが、Angular、Angular 2、Vue、Mithrilなどにもバインディングがあります。Reduxは、他のコードで使用できるサブスクリプションメカニズムを提供するだけです。ただし、Reactや利用可能な同様のライブラリなど、状態の変更からUIの更新を推測できる宣言型のビュー実装と組み合わせると最も役立ちます。

Reduxを使用するために特定のビルドツールが必要ですか？​

Reduxは、最新のJS構文（ES2020）を使用して記述されていますが、コードは非常にシンプルです。

古いブラウザーをターゲットにする必要がある場合は、自分でトランスパイルしてください。

counter-vanillaの例では、Reduxが<script>タグとして含まれている基本的なES5の使用法を示しています。関連するプルリクエストが述べているように

新しいCounter Vanillaの例は、ReduxにWebpack、React、ホットリロード、saga、アクションクリエーター、定数、Babel、npm、CSSモジュール、デコレーター、流暢なラテン語、Eggheadのサブスクリプション、博士号、またはExceeds Expectations O.W.L.レベルが必要であるという神話を払拭することを目的としています。

いいえ、それは単なるHTML、いくつかの職人技の<script>タグ、および昔ながらのDOM操作です。お楽しみください！