web-dev-qa-db-ja.com

「単一ページWebアプリ」のアーキテクチャガイドライン

「単一ページ」のWebアプリケーションを構築するためのサイドプロジェクトを開始します。アプリケーションはリアルタイムである必要があり、変更が発生するとクライアントに更新を送信します。

これらの種類のアプリケーションのアーキテクチャに関するベストプラクティスアプローチのための優れたリソースはありますか?これまでに見つけた最高のリソースは、次のtrelloアーキテクチャの記事です。 http://blog.fogcreek.com/the-trello-tech-stack/

私には、このアーキテクチャは非常にセクシーですが、おそらく私の特定のニーズに合わせて過剰に設計されています。サーバー側でサブ/パブに悩む必要があるかどうか疑問に思っています。何かが起こったとき(たとえば、クライアントがサーバーに更新を送信したとき、更新をデータベースに書き込んだとき)更新をクライアントに送信します)。

技術的には、おそらくNode.JSまたは多分Rubyでこれを構築することを検討していますが、アーキテクチャのガイドラインは、基礎となるサーバー技術にある程度適用されるはずです。

12
Matt Roberts

私は、Backbone.jsなどのクライアント側のMVCに明確に目を向けます。これは非常に軽量ですが、アプリケーションに必要な構造を提供します。私は、バックボーンについて学ぶ最も速い方法として、Peepcodeスクリーンキャストを強くお勧めします。

このようなクライアント側MVCの優れたアーキテクチャ上の利点は、サーバー側とのdataの交換に向けてより簡単に移動できるということです。 RESTを介した構造化JSON。

Backbone.jsはそのままでこれをサポートします。クライアントとサーバーの間でJSONとしてモデルをシリアル化できます。これにより、リクエスト/レスポンスの観点から考える必要がなくなります。

サーバー側のNode.jsのようなものがこのモデルの下で魅力的です。このモデルでは、データをプッシュおよびプルするための、多くの短期間の潜在的に非同期のリクエストがあります。

1つの選択肢.... Comet のようなモデルは、Web pub/subを実現する簡単な方法であり、これをサポートするサーバー側フレームワークがいくつかあります。

5

これは簡単なIMOです。フロントエンドのAngularJSはすばらしいので。動的でセクシーなバックエンド用のNodeJS/express/SocketIO。さらに、おまけとして、表と裏で1つの言語を使用できます。

例として、同じ実装 https://github.com/hackify/hackify-server を確認してください

1つの警告、一部の人々はsockjsと呼ばれるsocketioの代わりにNodeJSを推奨していますが、私はこれをチェックしていないので推奨できません

1

おそらく、フロントエンドにはMV * JavaScriptフレームワークを使用します。私自身が単一ページのWebアプリケーションを作成していて、いくつかのソリューションを調査した後、Backbone.jsを使用することになりました。このソリューションはすぐに使える機能をほとんど提供していませんでしたが、最初にコアとなる基盤を提供し、他のソリューション(私にとって重要でした)よりもはるかに柔軟です。

他の一般的なソリューションは、Ember.jsとKnockout.jsです。これらは、すぐに使用できる機能を提供しますが、これらの規則に従って(機能する場合と機能しない場合がある)使用する必要があります。

1
ryanzec

リアルタイムのクライアント更新が必要な場合は、長時間ブロッキングの「AJAX」呼び出しを実装するか、できれば最新のWebソケットを使用する必要があります。これらにより、更新を接続されたクライアントにプッシュすることができます。これは、少しのJavaScriptによって処理されます。

現在の最新(または最新の流行)はGoogleのAngularJSだと理解しています。その一部は、SPAの作成を容易にするために設計されています。

0
gbjbaanb

あなたが見ているもののように聞こえます [Apache 2.2 with [〜#〜] php [〜#〜] または Tomcat application server withリクエストを処理する単純なサーブレット。それはハンマーと釘の大工の同等物です。複雑なことは何もありませんが、仕事が完了します。機能を拡張する必要がある場合は、Tomcatが必要に応じてjspおよびjsfをサポートできるため、いつでも機能を拡張できます。

フロントエンドについては、 jQuery$。post$。load$ .ajaxjQuery UI と組み合わせてページに機能を追加する手段として2倍にするのは非常に便利なので

0
Neil

リアクティブである必要がある単一ページアプリケーションを構築するために、平均スタック(node.js、mongo ...)に近いものが必要な場合は、 meteor を選択します。特に、プロトタイプを作成し、ゼロから始める場合はなおさらです。

angularフロントエンドを使用したRailsは問題ありませんが、特定のgemを文字列で一緒にインストールする必要があるため、「変更が発生したときにクライアントに更新を送信する」ことが難しくなります。いくつかのロングポーリングまたはsockjsライブラリ...

0