EWD 3
トレーニング・コース #15
ewd-xpress で jQuery以外の
フレームワークを利用する
M/Gateway Developments Ltd.
Rob Tweed
訳: 日本ダイナシステム株式会社 嶋 芳成
ewd-xpress: フレームワークを感知しない
• ewd-xpress は、ブラウザ側の特定の JavaScript
フレームワークには依存しないように設計されています
• jQuery は単にデフォルトで依存しているだけです
• 従って、任意のフレームワークを利用できます
2016/9/8 EWD 3 トレーニング・コース #15 2
同一の起動パターンに従うだけです
• DOM がロード完了したかをチェックして、
• EWD を起動して、
• ewd-registered イベントを処理します
• その後、EWD.send() を用いてメッセージをバックエン
ドに通常通り送信します
2016/9/8 EWD 3 トレーニング・コース #15 3
他のフレームワークをewd-xpressと統合する
• ExtJS + WebSocket の例:
Ext.define(‘Test Application’, {
extend: ‘Ext.app.Application’,
name: ‘test’
launch: function(profile) {
EWD.on(‘ewd-registered’, function() {
EWD.send({
type:’test’,
params: {
text: ‘Hey! Sending a test message!’
}
},function(responseObj) {
console.log(‘ewd3 ‘ + responseObj.type + ‘ back-end respons:’, responseObj);
});
});
EWD.log = true;
EWD.start({
application: ‘test-app’,
io:io
});
}
});
2016/9/8 EWD 3 トレーニング・コース #15 4

EWD 3トレーニングコース#15 ewd-xpressでjQuery以外のフレームワークを利用する

  • 1.
    EWD 3 トレーニング・コース #15 ewd-xpressで jQuery以外の フレームワークを利用する M/Gateway Developments Ltd. Rob Tweed 訳: 日本ダイナシステム株式会社 嶋 芳成
  • 2.
    ewd-xpress: フレームワークを感知しない • ewd-xpressは、ブラウザ側の特定の JavaScript フレームワークには依存しないように設計されています • jQuery は単にデフォルトで依存しているだけです • 従って、任意のフレームワークを利用できます 2016/9/8 EWD 3 トレーニング・コース #15 2
  • 3.
    同一の起動パターンに従うだけです • DOM がロード完了したかをチェックして、 •EWD を起動して、 • ewd-registered イベントを処理します • その後、EWD.send() を用いてメッセージをバックエン ドに通常通り送信します 2016/9/8 EWD 3 トレーニング・コース #15 3
  • 4.
    他のフレームワークをewd-xpressと統合する • ExtJS +WebSocket の例: Ext.define(‘Test Application’, { extend: ‘Ext.app.Application’, name: ‘test’ launch: function(profile) { EWD.on(‘ewd-registered’, function() { EWD.send({ type:’test’, params: { text: ‘Hey! Sending a test message!’ } },function(responseObj) { console.log(‘ewd3 ‘ + responseObj.type + ‘ back-end respons:’, responseObj); }); }); EWD.log = true; EWD.start({ application: ‘test-app’, io:io }); } }); 2016/9/8 EWD 3 トレーニング・コース #15 4