More Related Content
Similar to Real-time, collaborative applications in Plone
![Getting Started with Apache Spark: Big Data Made Simple [Free Meetup]](https://cdn.slidesharecdn.com/ss_thumbnails/apachesparkgettingstarted-260203175547-8361bcc3-thumbnail.jpg?width=640&height=640&fit=bounds)
Real-time, collaborative applications in Plone
- 1.
- 2. What are real-timeweb applications? ● Instant Messaging ● Voice and Video conferencing ● File transfer ● Feeds/Notifications ● Collaborative editing
- 3. Building blocks ● XMPP Server and connection manager – E.g ejabberd ● Nginx/Apache – Reverse proxy for connection manager ● Plone add-ons – collective.xmpp.core – collective.xmpp.collaboration – collective.xmpp.chat – collective.xmpp.pubsub – <your product here>
- 4. How does XMPPwork? ● eXtensible Messaging and Presence Protocol ● Universal Unique Identifier (JID) – jcbrand@jabber.plone.org/sprint ● Data exchanged as XML “stanzas” – Presence – Message – Info/Query (IQ) ● Roster and social graph
- 5.
- 6.
- 7.
- 8.
- 9. Strophe.js ● XMPP library for JavaScript ● Connects via BOSH to XMPP server
- 10. Strophe.js ● XMPP library for JavaScript ● Connects via BOSH to XMPP server ● Can add stanza handlers
- 11. Strophe.js ● XMPP library for JavaScript ● Connects via BOSH to XMPP server ● Can add stanza handlers ● Can build stanzas
- 12. Strophe.js ● XMPP library for JavaScript ● Connects via BOSH to XMPP server ● Can add stanza handlers ● Can build stanzas ● Plugins – MUC, Roster, Pubsub, Data Forms etc.
- 13. Backbone.js ● Enables structured javascript – Models ● Key/value binding ● Custom events – Collections – Views ● Declarative event handling ● Templates – RESTful JSON interface for connecting with API
- 14. Backbone.js Examples ● Creating a model: ● Instantiating a model:
- 15. Backbone.js Examples ● Creating a view
- 16.
- 17. Real-time Plone ● Messaging – Multi/Single user chat – File sharing ● Collaboration – Documents, Whiteboard, UML, Mindmaps – Translations – Pair programming (Plone IDE, Theme Editor) ● Continuous feedback – System status messages – User feeds ● Audio/Video Conferencing
- 18. Thanks for attending J-C Brand web: http://opkode.com email: jc@opkode.com twitter: @jcopkode IRC: jcbrand
- 19. Image credits: ● Legomen looking for guinnes http://estiletesemcabo.tumblr.com/post/2190751969 ● Stormtrooper on facebook http://www.flickr.com/photos/balakov/ ● Legoman with innards http://www.facebook.com/pages/Jason-Freeny/34170123768 ● Lego wizard http://en.bricker.ru/sets/5614/
Editor's Notes
- #2 Outline of talk: - Define real-time web apps and relevancy to Plone - Look at collective.xmpp.chat and it's building blocks - Detailed look at XMPP - Strophe.js - Backbone.js - Vision for a real-time Plone Outcome for this talk: - Good overview of tech involved - Inspired by possibilities Theme of talk is collaboration People collaborate to create Plone, and Plone is then used to enable other people to collaborate on getting other tasks done. What makes me excited about real-time applications on Plone, is their potential for creating even more natural and fluid means for user-collaboration.
- #3 * Instant Messaging In the late 90s we have multiple closed proprietary messaging protocols. Common for users to run more than one chat application because no single vendor had 100% market share. Developers started writing multi-protocol clients to, Protocols often undocumented and the IM networks aggressively changed the protocols Jeremie Miller announced the Jabber project in January 1999. It's first production release was in 2000. * Voice and Video conferencing XMPP can be extended, and Jingle is such an extension that makes VoIP and video conf possible. The media sessions are P2P or mediated through relay server and XMPP is used to initiate and manage (route) these sessions. So session negotiation happens over the XMPP channel and media is exchanged over a separate data channel. * File transfer The data transfer that Jingle facilitates doesn't have to be multimedia, can be any file.
- #4 Outro I've started this talk, by mentioning collaboration, how Plone is the product of collaboration and how Plone enables other people, outside of our community of developers, resellers and integrators, to collaborate. I hope this talk made you more excited as to the possibilities for real-time applications in Plone and that you would like to collaborate with me on realising the potential these technologies hold for the future of Plone.
- #5 * eXtensible Messaging and Presence Protocol - Protocol for moving small, structured pieces of data between two places. * Data exchanged as XML in "stanzas" * XML data organised as pair of streams, one per direction of communication * Each stream has opening element, stanzas, closing element. * Each stanza is a 1st level element. * At the end of the closing element, two streams form pair of valid XML docs * Designed for small bits of info. Large blobs can be sent in an out-of-band transport layer with XMPP acting as signaling layer. * Extensible: * XML is very extensible * Extremely easy to add new features (both forward and backward compatible) * More than 200 registered extensions * Social media constructs and featues baked in. * Contract rosters create social graph * Presence notifications sent automatically when user logs in * Makes it a good choice as underlying tech, devs can focus on unique app
- #6 * Message Stanza Stanzas are the direct child elements of the root <stream/> element. *id* optional attr denoting the conversation *type* optional subtype (chat, groupchat) *xml:lang* for human readable content * Presence Stanza Optional "type" attribute to signal whether a user is available for comm. It can also request or respond to contact subscriptions. o probe -- Request for an entity's current presence; SHOULD be generated only by a server on behalf of a user. o error -- Error occurred regarding processing or delivery of a previously-sent presence The presence stanza can have the following child elements: * <show/>: "away", "chat", "dnd" and "xa". * <status/>: text meant for human consumption. * <priority/>: non-human-readable XML char data (priority level of the resource) * IQ Stanza Provides a structured request-response mechanism. For example: Roster management, querying the latest published elements of a node and data forms. Extended elements: Either declare new namespace by including "xmlns" attribute on element, or use namespace prefixes.
- #7 * Message Stanza Stanzas are the direct child elements of the root <stream/> element. *id* optional attr denoting the conversation *type* optional subtype (chat, groupchat) *xml:lang* for human readable content * Presence Stanza Optional "type" attribute to signal whether a user is available for comm. It can also request or respond to contact subscriptions. o probe -- Request for an entity's current presence; SHOULD be generated only by a server on behalf of a user. o error -- Error occurred regarding processing or delivery of a previously-sent presence The presence stanza can have the following child elements: * <show/>: "away", "chat", "dnd" and "xa". * <status/>: text meant for human consumption. * <priority/>: non-human-readable XML char data (priority level of the resource) * IQ Stanza Provides a structured request-response mechanism. For example: Roster management, querying the latest published elements of a node and data forms. Extended elements: Either declare new namespace by including "xmlns" attribute on element, or use namespace prefixes.
- #8 * Message Stanza Stanzas are the direct child elements of the root <stream/> element. *id* optional attr denoting the conversation *type* optional subtype (chat, groupchat) *xml:lang* for human readable content * Presence Stanza Optional "type" attribute to signal whether a user is available for comm. It can also request or respond to contact subscriptions. o probe -- Request for an entity's current presence; SHOULD be generated only by a server on behalf of a user. o error -- Error occurred regarding processing or delivery of a previously-sent presence The presence stanza can have the following child elements: * <show/>: "away", "chat", "dnd" and "xa". * <status/>: text meant for human consumption. * <priority/>: non-human-readable XML char data (priority level of the resource) * IQ Stanza Provides a structured request-response mechanism. For example: Roster management, querying the latest published elements of a node and data forms. Extended elements: Either declare new namespace by including "xmlns" attribute on element, or use namespace prefixes.
- #9 * Message Stanza Stanzas are the direct child elements of the root <stream/> element. *id* optional attr denoting the conversation *type* optional subtype (chat, groupchat) *xml:lang* for human readable content * Presence Stanza Optional "type" attribute to signal whether a user is available for comm. It can also request or respond to contact subscriptions. o probe -- Request for an entity's current presence; SHOULD be generated only by a server on behalf of a user. o error -- Error occurred regarding processing or delivery of a previously-sent presence The presence stanza can have the following child elements: * <show/>: "away", "chat", "dnd" and "xa". * <status/>: text meant for human consumption. * <priority/>: non-human-readable XML char data (priority level of the resource) * IQ Stanza Provides a structured request-response mechanism. For example: Roster management, querying the latest published elements of a node and data forms. Extended elements: Either declare new namespace by including "xmlns" attribute on element, or use namespace prefixes.