Social Developers London Presetation featuring @recorditapp, @STTLibrary, ‏and Real-time demos with Node.js and WebSockets from @romainhuet and Stewart Harper (see links)

1. Angus Fox
Co-Chair Social Developers London
@nuxnix
This talk draws on information from
developers.facebook.com and dev.twitter.com
but is in no way endorsed byTwitter Corporation
or Facebook Corporation  #justsaying

2. The first places to start are at dev.twitter.com and
developers.facebook.com
@recorditapp
#worldcup
• Prototype engagement
flow
Stream API
• Sample
• Filter
• Context
• Heatmap

4. GIF support in theTwitter API
NativeTwitter authentication on OS X
They use STTwitter - an Objective-C library forTwitter REST
API 1.1 and (often overlooked)AppleScript
After the user provides credentials, they can then be
guaranteed that ourAPI upload of the tweet with a GIF will
work.
On first use only which makes it really simple to share GIFs.
https://github.com/nst/STTwitter @STTLibrary
https://twitter.com/recorditapp/statuses/479723295550353409

5. If no such account exists, they use AppleScript plus Apple’s
Scripting Bridge: -
tell application "System Preferences"
activate
set the current pane to pane id
"com.apple.preferences.internetaccounts"
get the name of every anchor of pane id
"com.apple.preferences.internetaccounts"
reveal anchor
"com.apple.twitter.iaplugin" of pane id
"com.apple.preferences.internetaccounts"
end tell

6. Generates a header file with an API that you can use to communicate with another
application using Objective-C code.
SystemPreferencesApplication *systemPreferences = [SBApplication
applicationWithBundleIdentifier:@"com.apple.systempreferences"];
SystemPreferencesPane *pane = (SystemPreferencesPane *)
[[systemPreferences panes]
objectWithID:@"com.apple.preferences.internetaccounts"];
SystemPreferencesAnchor *anchor = (SystemPreferencesAnchor *)
[[pane anchors] objectWithName:@"com.apple.twitter.iaplugin"];
[systemPreferences activate];
systemPreferences.currentPane = pane;
[anchor reveal]

7. Lets talk about the world cup

8. Twitter.Com has had a
#worldcup makeover
https://twitter.com/i/start/world_cup/choose_tea
m
After Choosing a team,
encourages you to
change profile pic
https://twitter.com/i/start/world_cup/setup_profile
Suggests followers
https://twitter.com/i/start/world_cup/follow_team
Tweet your support

9. Twitter.Com has had a
#worldcup makeover
https://twitter.com/i/start/world_cup/choose_tea
m
After Choosing a team,
encourages you to
change profile pic
https://twitter.com/i/start/world_cup/setup_profile
Suggests followers
https://twitter.com/i/start/world_cup/follow_team
Tweet your support
Get Started
Add some affinity to
your twitter picture
Add followers with the
same affinity
Tweet Support

10. A couple of SampleApps might stimulate your appetite
#worldcup
• Prototype
engagement flow
Stream API
• Creating an App
• Sample Endpoint
• Heatmap

11. Streaming APIs are at the cornerstone of the most
fascinating products relying onTwitter data.
 Analyzing the mood of people in the world
 predicting elections
 detecting breaking news
 providing help to people during emergencies
https://blog.twitter.com/2014/connecting-to-the-pulse-of-
the-planet-with-twitter-apis
https://dev.twitter.com/docs/streaming-apis/streams/public
https://github.com/romainhuet/twitter-platform-demos

15. Provides you with roughly 1% of allTweets,
randomly selected from the firehose.
There are 500 millionTweets posted every
single day, so 1% is still a very large number
and statistically relevant for many use cases.
https://dev.twitter.com/docs/api/1.1/get/statuse
s/sample
DEMO OAuth signing results

17. The filter endpoint, lets you receiveTweets
matching different criteria to trackTweets
 with some keywords,
 from a selection of users
 around a location when users explicitly choose to
share it

19. Stream geo-tagged tweets using Node.js
The end result is a real-time heat map
depicting where in the world people are
tweeting from
Download it from github
http://blog.safe.com/2014/03/twitter-stream-
api-map/
 March 25, 2014 - Stewart Harper

20. Package.json holds a variety of metadata
related to the project and lists dependencies.
Server.js is where all of the logic lies.This
code first sets up a web server using express,
which serves the static web pages, loads
socket.io the web socket module, and loads
theTwitterAPI module.

21. You must create an application onTwitter.
Set the API keys to those in the twitterAPI
tab.
 API key > consumer_key
 API secret > consumer_secret
 Access token > access_token_key
 Access token secret > access_token_secret

22. The client mapping application connects to the web
socket server and triggers the connection listener.
Another listener, start tweets, is set up and a
connected message is sent to the client telling them
they are connected and everything is ready.
When the client receives this message, it sends a
message to the start tweets listener and theTweets
get streamed.
 We only want to streamTweets with location, so they are
parsed, and if they have coordinates we create a simple
piece of JSON containing the location.

23. This sets up the Google Map then opens up a
websocket connection with the server.
Once the server confirms it has received the
connection and is ready to start sendingTweets,
the connected listener is called and the client
sends a message back to the server to say it is
ready via socket.emit(“start tweets”);.
The server responds with a stream ofTweets
captured in the twitter-stream listener, where
they are added to an array bound to a Google
Maps heat layer.

25. Presentations are available from Slideshare
Slides
http://www.slideshare.net/nuxnix