ajax - Node、Express、Ajax、およびJadeの例

Question

クライアント側とサーバー側の両方のコードでAjax呼び出しを使用して更新されるNode/Express/Jadeページの簡単な例を探しています。

頭の中ですべてをまとめるのに少し苦労しています。

Answer 1

これを行うには非常に多くの方法があり、どのアプローチを採用したいかはすぐにはわかりません。

最も単純なシナリオは、サーバーからhtmlの一部をフェッチしてクライアントを更新するために、クライアント側のロジックを追加することだと思います。これは、jQueryを使用して簡単に実現できます（イベントを接続するためにドキュメントレディブロック内に配置します）。

$('#button').click(function() {
     $.get('/some/url', {foo: 42}, function(result) {
         $('#target').html(result);
     }
}

このようにして、すべてのhtmlがサーバー上で生成され、必要に応じてそれをフェッチしてページに挿入するだけです。

サーバーからjsonをフェッチし、クライアントでhtmlをレンダリングすることもできますが、これは代替アプローチの1つです。TodoMVCを見てみることを強くお勧めします。これは、さまざまな実装（それぞれが異なるフレームワークを使用）を備えたTodoリストアプリケーションであるため、さまざまなアプローチやヘルパーライブラリの優れた学習リソースです。

また、ハンズオンNode.jsの本もお勧めします。ルーティングとNodeの使用を開始する方法を理解するのに役立ちます。