square womeng hear and now: college edition talk
TRANSCRIPT
Square WomEng Talk8/11/2016@lizziepika
#attendMeetups
@lizziepika
#organizeMeetups@lizziepika
#giveTalks@lizziepika
@GoogleSF#SFHTML5
@YouTube
@lizziepika
#socialMediaPresence
@lizziepika
Heart of teacher, mind of hacker, soul of entrepreneur
#excited@lizziepika
#werk@lizziepika
● Realtime Global Data Stream Network (DSN)
● Provides back-end for many apps
● SaaS
What is PubNub?@lizziepika
> 75 SDKs supported
@lizziepika
● Unicast
● Broadcast
● Multicast
Ways to Communicate
@lizziepika
● Data Stream Network (DSN) like Content Delivery Network (CDN)
● Both send data based on location
● CDN = static = news article, YouTube video
● DSN = realtime data = stocks, weather
Data Delivery Types
@lizziepika
● Senders characterize messages into classes
● Don’t know receiver
● Indirect receivers = subscribers
● Subscribers choose
● Common in software architecture
Publish/Subscribe
● Message contains
● Channel
● Data payload
● Pub. client -> channel -> sub. client
PubNub pub/sub
@lizziepika
● Chat
● Multi-player games
● Geolocation
● Financial data
● Collaborative developer tools
● Internet of Things (IoT)
● Currently 35 + industry use cases
Use Cases
@lizziepika
EON.js realtime Chart + Map Framework
@lizziepika
Quick run-down of PubNub Publish/Subscribe in voting
app@lizziepika
● <scriptsrc=”http//cdn.pubnub.com/pubnub-3.x.x.js"> </script>
● At the moment, 3.4.4
● OR Install via Node.JS
● $ npm install pubnub
JavaScript SDK
@lizziepika
● var pub_key = "pub-c-156a62fb.";
● var sub_key = "sub-c-f762fb78...”;
● var chan = "your-channel-name";
API Keys
@lizziepika
var pb = PUBNUB.init({
publish_key: pub_key,
subscribe_key: sub_key
…
});
Initialization ● init() creates instance of PubNub object
● Needed to invoke PubNub methods
@lizziepika
Optional, extra params
like uuid, restore, etc.
● Dictionary:
● key = name
● value = count
var pollOptions = {
eon: {
"Mushu": 0,"Stephen": 0,"Max": 0,"Kevin": 0
}
Data Structure: Dictionary
@lizziepika
function publishResults() {
pb.publish({
channel: chan,
message: pollOptions,
Publish Results
@lizziepika
Draw Chartfunction drawChart() {
eon.chart({
channel: chan,
history: true,
pubnub: pb,
generate: {
bindto: '#chart'@lizziepika
@lizziepika
All gifs from GiphyEmojis from @stephenlb
https://upload.wikimedia.org/wikipedia/en/d/dc/Bryn_Mawr_seal.png
https://brandfolder.com/pubnub/logo/pubnub-primary-logo.png
http://cdn.mos.cms.futurecdn.net/5116e9f27817ae467026de2d807c3aa4.jpg
https://www.raspberrypi.org/wp-content/uploads/2015/08/raspberry-pi-logo.png
http://image.slidesharecdn.com/eonpresentation-150917200402-lva1-app6891/95/pubnub-eon-realtime-dashboard-framework-9-
638.jpg?cb=1442520398