2016-05-21 2 views
0

私は、外部のソースから更新を受け取るアプリケーションを構築しています。 (更新情報は株価で、10-60秒ごとに散発的に表示されます)reduxとサーバー側の更新に関するアドバイスが必要

各クライアントページには、興味深い株の完全なリストが表示されるか、単一の株に集中する可能性があります。そのページに表示されている在庫の新しいデータをサーバが受信すると、どのページのコンポーネントも更新されます。

私の質問は:

  1. reactは、reactは、react-reduxモジュールは、ブラウザにサーバー側の更新とクライアントコンポーネント間の通信を処理するアウトオブボックス? (明らかに私はアクション/レデューサー/ etcを書かなければならないでしょう)また、サーバーからクライアントにそれらの更新を伝えるコードを書く必要がありますか?

  2. 私は、listen(3000)呼び出しを起動するメインのserver.jsコードから在庫更新を受け取るサーバー側プロセスを開始することを想定しています。その在庫更新プロセスはどのようにしてレデックスストアにアクセスできますか? (私の混乱は、私が読んだExpressサンプルの大部分で、createStore()コールがapp.use('/', ...)の範囲内にあるためです。

  3. プロジェクトへの任意のポインタが似ています私は何をしたいのですか?ありがとう。

+0

これらの思いやりのある回答に感謝します。 1.サーバーには、外部ソースからの更新を記録するストアが存在する必要があります。そのストアは、実際の状態または現在の状態を保持します。 2.新しいクライアントが接続されると、サーバー側のレンダリングですべてのコンポーネントが現在のストアのデータで満たされます。 3.新しい更新がサーバーに到着すると、サーバー側のストアを更新するコードを記述する必要がありますが、接続されたクライアントには新しい情報も送信されます。これを行うための代替手段としてsocket.ioとrelay/graphqlをチェックアウトする必要があります。 本当ですか? –

+0

あなたはサーバーにストアを言うときにデータベースを意味しますか?次にはい。もちろん、株式の更新をデータベースに保存することができます。これらの値はクライアントに送信できます。最初のステップとして、おそらく今は外しておくことができます。より洗練されたものには、データベースを最新の在庫更新で定期的に更新する別のスレッド/プロセスが必要なのかもしれません。それはクライアントのための一時的なキャッシュのような種類のサーバーです。あなたはサーバー側にreduxストアを持つ必要はありません。 –

答えて

1

[私自身の質問に答える]上記のさまざまな投稿者からの返答は正確で非常に有用ですが、私はリアクションを使ってアプリケーションを構造化する方法を学習しました。還元する。私は私の新しい知識を共有したいと思った:私は私が始めるについて学んだことをまとめたブログ投稿を書きReal Time Trader Desktop with React, Node.js, and Socket.io

    • クリストフCoenraetsはまさに私のユースケースに一致するブログ投稿を書きました2016年中頃の反応プログラミング:Getting Started with React Development

  • +0

    そのブログ記事はとても役立ちます!ありがとう。 –

    3
    1. あなたは、サーバからクライアントに更新を伝達するコードを記述する必要があります。これを行う最善の方法は、WebSocketを使用することです。 http://socket.io/などのフレームワークを使用できます。
    2. サーバー側でcreateStoreを使用するExpressサンプルは、サーバー側のレンダリング用です。在庫の更新を押し込むためにここにアクセスすることは好ましくありません。簡単に言うと

    、何をする必要がある、

    1. は、クライアント上で
    2. ioのか、WebSocketのサーバーソケットを設定され、ソケット-IOクライアントを設定。サーバーからのメッセージを待ちます。
    3. 在庫が更新されるたびに、ソケットioを通じてサーバーからクライアントにデータを送信します。
    4. クライアントがメッセージを受信すると、データとともにアクションをディスパッチし、リミックスフローが状態/ストアを処理するようにします。
    +0

    はい。私はsocket.ioを介してこれらのアップデートの非同期到着を伝えることに切り替えました。非常に滑らか! –

    2

    いいえにはReduxのは、サーバー側との間の通信を処理しないと反応せず、成分(クライアント側)

    • を反応どちら
    • reduxがサーバ間のアプリケーション状態

    通信を管理UIビューとして作品を反応しクライアントはアクションとアクションクリエイターに落ちます。この場合、(ポーリングによって)サーバーへのajax呼び出しを行うことができ、状態はブールフェッチ、フェッチ、フェイリングのいずれかでなければなりませんストア内でレスポンスオブジェクトとともに管理されます。

    サーバーサイド在庫の更新処理の問題について

    のみ実装者は、初期状態がCREATESTORE(つまりを依頼する質問はあなたにそれを問題ではないので、何であるかunderstantいるので、それは問題ではない)中ですと呼ばれ、それはアプリケーションの初期状態です。あなたのケースCREATESTOREの はあなたにものためのネットワーク層が付属しています relay and graphqlを確認したいことがあり、メインserver.js

    から時点の株式を取得し、その減速このような場合に構成することができすべてのアプリケーション状態を管理しようとするデフォルトのサーバーへの通信

    関連する問題