This document discusses using QEWD, a framework for building real-time web applications, with frameworks other than jQuery. It states that QEWD is framework agnostic and can be used with any framework like Angular, React, Ember, and ExtJS. It provides an example of integrating QEWD with ExtJS by starting EWD after the DOM loads and handling the ewd-registered event to send messages to the backend. It also notes there are separate slide decks on using QEWD specifically with React.

1. Copyright © 2016 M/Gateway Developments Ltd
EWD 3 Training Course
Part 15
Using a Framework other than
jQuery with QEWD
Rob Tweed
Director, M/Gateway Developments Ltd
Twitter: @rtweed

2. Copyright © 2016 M/Gateway Developments Ltd
QEWD is framework agnostic
• QEWD is designed to have no
dependencies on any particular browser-
side JavaScript frameworks
• jQuery is simply a default dependency
• You can use any other framework, eg:
– Angular
– React
– Ember
– ExtJS….etc

3. Copyright © 2016 M/Gateway Developments Ltd
Just follow the same startup pattern
• Check that the DOM has loaded, then:
– Start EWD, then:
• Handle the ewd-registered event
• After that, use EWD.send() to send
messages to back end as normal

4. Copyright © 2016 M/Gateway Developments Ltd
Integrating ewd-client with another framework
• ExtJS + WebSockets Example:
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 response: ', responseObj);
});
});
EWD.log = true;
EWD.start({
application: 'test-app',
io: io
});
}
});

5. Copyright © 2016 M/Gateway Developments Ltd
Using QEWD with React.js
• See the specific slide decks on using
QEWD with React, later in this course