Slides for my talk as a speaker and panelist for college lightning tech talks at Square, San Francisco, on August 11, 2016. The talk was on Developer Evangelism; some projects I made this summer as a PubNub intern; how to get started with PubNub, the only global Data Stream Network; and how to make a realtime web voting application using PubNub's Project EON.js graph and chart framework.

1. Square WomEng Talk
8/11/2016@lizziepika

2. #attendMeetups
@lizziepika

3. #organizeMeetups
@lizziepika

4. #giveTalks@lizziepika
@GoogleSF
#SFHTML5
@YouTube

5. @lizziepika
#socialMediaPresence

6. @lizziepika
Heart of teacher, mind of
hacker, soul of entrepreneur

7. #excited
@lizziepika

8. #werk@lizziepika

9. ● Realtime Global Data Stream Network
(DSN)
● Provides back-end for many apps
● SaaS
What is PubNub?
@lizziepika

10. > 75 SDKs supported
@lizziepika

11. ● Unicast
● Broadcast
● Multicast
Ways to Communicate
@lizziepika

12. ● 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

13. ● Senders characterize messages into
classes
● Don’t know receiver
● Indirect receivers = subscribers
● Subscribers choose
● Common in software architecture
Publish/Subscribe

14. ● Message contains
● Channel
● Data payload
● Pub. client -> channel -> sub. client
PubNub pub/sub
@lizziepika

15. ● Chat
● Multi-player games
● Geolocation
● Financial data
● Collaborative developer tools
● Internet of Things (IoT)
● Currently 35 + industry use cases
Use Cases
@lizziepika

16. EON.js realtime Chart
+ Map Framework

17. @lizziepika

18. Quickrun-downofPubNub
Publish/Subscribeinvoting
app
@lizziepika

19. ● <script
src=”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

20. ● var pub_key = "pub-c-156a62fb.";
● var sub_key = "sub-c-f762fb78...”;
● var chan = "your-channel-name";
API Keys
@lizziepika

21. 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.

22. ● Dictionary:
● key = name
● value = count
var pollOptions = {
eon: {
"Mushu": 0,"Stephen": 0,"Max": 0,"Kevin": 0
}
Data Structure: Dictionary
@lizziepika

23. function publishResults() {
pb.publish({
channel: chan,
message: pollOptions,
Publish Results
@lizziepika

24. Draw Chart
function drawChart() {
eon.chart({
channel: chan,
history: true,
pubnub: pb,
generate: {
bindto: '#chart'
@lizziepika

25. @lizziepika
All gifs from Giphy
Emojis 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