2. About Us @themattharris @jasoncosta Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 2
3. et demi!Monday, July 18, 11 3
4. About Us @themattharris @jasoncosta @twitterapi @episod @rno
Open Web Camp III Stanford University July 16, 2011Monday, July 18,
11 4
5. It shouldnt take longer than 5 minutes to allow someone to
Tweet about your content, and stay informed about what youre
saying.Monday, July 18, 11 5
6. Overview Sending a Tweet Reviewing the technology Making it
easier Following a user Doing more Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 6
7. Overview Sending a Tweet Reviewing the technology Making it
easier Following a user Doing more Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 7
8. Tweeting the RESTful way
https://api.twitter.com/1/statuses/update.json -d status="Working
on the Open Web Camp III presentation" { "coordinates": null,
"created_at": "Sat Jul 09 19:17:34 +0000 2011", "truncated": false,
"favorited": false, "id_str": "89775215936143360",
"in_reply_to_user_id_str": null, "contributors": null, "text":
"Working on the Open Web Camp III presentation", ... } Open Web
Camp III Stanford University July 16, 2011Monday, July 18, 11
8
9. Tweeting through twitter.com Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 9
10. Tweeting through twitter.com Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 10
11. Tweeting with @anywhere Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 11
12. Tweeting with @anywhere Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 12
13. Is there an easier way?Monday, July 18, 11 13
14. Overview Sending a Tweet Reviewing the technology Making it
easier Following a user Doing more Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 14
15. The RESTful way ... Requires some programming experience
Open Web Camp III Stanford University July 16, 2011Monday, July 18,
11 15
16. The RESTful way ... Requires some programming experience
Often needs a developer to have privileged access to a server Open
Web Camp III Stanford University July 16, 2011Monday, July 18, 11
16
17. The RESTful way ... Requires some programming experience
Often needs a developer to have privileged access to a server
Requires the developer to handle the authentication (OAuth) Open
Web Camp III Stanford University July 16, 2011Monday, July 18, 11
17
18. The RESTful way ... Requires some programming experience
Often needs a developer to have privileged access to a server
Requires the developer to handle the authentication (OAuth) Prefers
the developer to register an application on dev.twitter.com Open
Web Camp III Stanford University July 16, 2011Monday, July 18, 11
18
19. @anywhere ... Assumes a developer is comfortable developing
with JavaScript Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 19
20. @anywhere ... Assumes a developer is comfortable developing
with JavaScript Sometimes a developer needs privileged access to a
server Open Web Camp III Stanford University July 16, 2011Monday,
July 18, 11 20
21. @anywhere ... Assumes a developer is comfortable developing
with JavaScript Sometimes a developer needs privileged access to a
server Requires the developer to register an application on
dev.twitter.com Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 21
22. @anywhere ... Assumes a developer is comfortable developing
with JavaScript Sometimes a developer needs privileged access to a
server Requires the developer to register an application on
dev.twitter.com Requires every URL its used on to be registered
Open Web Camp III Stanford University July 16, 2011Monday, July 18,
11 22
23. @anywhere ... Assumes a developer is comfortable developing
with JavaScript Sometimes a developer needs privileged access to a
server Requires the developer to register an application on
dev.twitter.com Requires every URL its used on to be registered Can
be hard to implement without support from Twitter Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 23
24. @anywhere ... Assumes a developer is comfortable developing
with JavaScript Sometimes a developer needs privileged access to a
server Requires the developer to register an application on
dev.twitter.com Requires every URL its used on to be registered Can
be hard to implement without support from Twitter Some users nd it
confusing Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 24
25. some users nd it confusingMonday, July 18, 11 25
26. Monday, July 18, 11 26
27. Strengths & Weaknesses Method @anywhere REST Can code
client-side Performance tied to Strengths interactions
api.twitter.com JavaScript is familiar to RESTful model for
accessing developers resources Weaknesses Too complex to implement
Must handle authentication Need direct access to a Confusing model
for users server Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 27
28. Overview Sending a Tweet Reviewing the technology Making it
easier Following a user Doing more Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 28
29. Starting out Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 29
30. Starting out REST, @anywhere werent the right tools Open
Web Camp III Stanford University July 16, 2011Monday, July 18, 11
30
31. Starting out REST, @anywhere werent the right tools Many
open web technologies are familiar to users Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 31
32. Starting out REST, @anywhere werent the right tools Many
open web technologies are familiar to users HTML and JS can be
extended easily Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 32
33. Starting out REST, @anywhere werent the right tools Many
open web technologies are familiar to users HTML and JS can be
extended easily Improved ubiquity Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 33
34. Goals Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 34
35. Goals Remove the need for an application Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 35
36. Goals Remove the need for an application Dont require per
site customizations to get it to work Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 36
37. Goals Remove the need for an application Dont require per
site customizations to get it to work Provide exible and easy
integration methods Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 37
38. Goals Remove the need for an application Dont require per
site customizations to get it to work Provide exible and easy
integration methods High performance Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 38
39. No whalesMonday, July 18, 11 39
40. Remove the need for an application Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 40
41. Remove the need for an application Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 41
42. Dont require per site customizations Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 42
43. Dont require per site customizations Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 43
44. Provide exible integration methods Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 44
45. Provide exible integration methods HTML Tweet Open Web Camp
III Stanford University July 16, 2011Monday, July 18, 11 45
46. Provide exible integration methods HTML Tweet JavaScript
Tweet Open Web Camp III Stanford University July 16, 2011Monday,
July 18, 11 46
47. Provide exible integration methods HTML Tweet JavaScript
Tweet iFrame Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 47
48. Use standards and sensible defaults Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 48
49. Use standards and sensible defaults Detect the URL or use
rel=canonical if it exists Open Web Camp III Stanford University
July 16, 2011Monday, July 18, 11 49
50. Use standards and sensible defaults Detect the URL or use
rel=canonical if it exists Detect language from lang attribute,
browser language Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 50
51. Use standards and sensible defaults Detect the URL or use
rel=canonical if it exists Detect language from lang attribute,
browser language Detect via user from rel=me links that point to
twitter.com Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 51
52. Use standards and sensible defaults Detect the URL or use
rel=canonical if it exists Detect language from lang attribute,
browser language Detect via user from rel=me links that point to
twitter.com Allow values to be manually overridden Open Web Camp
III Stanford University July 16, 2011Monday, July 18, 11 52
53. Use standards and sensible defaults Data Source url Open
Web Camp III Stanford University July 16, 2011Monday, July 18, 11
53
54. Use standards and sensible defaults Data Source default url
HTTP Referrer Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 54
55. Use standards and sensible defaults Data Source rel
attribute default url rel=canonical HTTP Referrer Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 55
56. Use standards and sensible defaults Data Source data-*
attribute rel attribute default url data-url rel=canonical HTTP
Referrer Open Web Camp III Stanford University July 16, 2011Monday,
July 18, 11 56
57. Use standards and sensible defaults Data Source Query
string data-* attribute rel attribute default url ?url data-url
rel=canonical HTTP Referrer Open Web Camp III Stanford University
July 16, 2011Monday, July 18, 11 57
58. Use standards and sensible defaults Data Source Query
string data-* attribute rel attribute default url ?url data-url
rel=canonical HTTP Referrer via ?via data-via rel=me Open Web Camp
III Stanford University July 16, 2011Monday, July 18, 11 58
59. Use standards and sensible defaults Data Source Query
string data-* attribute rel attribute default url ?url data-url
rel=canonical HTTP Referrer via ?via data-via rel=me text ?text
data-text Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 59
60. Use standards and sensible defaults Data Source Query
string data-* attribute rel attribute default url ?url data-url
rel=canonical HTTP Referrer via ?via data-via rel=me text ?text
data-text Browser lang ?lang data-lang setting Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 60
61. Easy to integrate Open Web Camp III Stanford University
July 16, 2011Monday, July 18, 11 61
62. Easy to integrate YouTube WordPress Mashable Open Web Camp
III Stanford University July 16, 2011Monday, July 18, 11 62
63. WordPress.comMonday, July 18, 11 63
64. the easier wayMonday, July 18, 11 64
65. TweetMonday, July 18, 11 65
66. The Tweet Button Tweet Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 66
67. Monday, July 18, 11 67
68. Monday, July 18, 11 68
69. Monday, July 18, 11 69
70. Overview Sending a Tweet Reviewing the technology Making it
easier Following a user Doing more Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 70
71. Following the RESTful way
https://api.twitter.com/1/friendships/create.json -d user_id=777925
{ "expanded_url": "http://themattharris.com", "name": "Matt
Harris", "created_at": "Sat Feb 17 20:49:54 +0000 2007",
"location": "SFO/LHR/YVR/JAX/IAD/AUS", "id_str": "777925",
"protected": false, "time_zone": "Pacific Time (US & Canada)",
"geo_enabled": true, "description": "Developer Advocate at Twitter
and married to @cindyli. NASA enthusiast, British expat and all
around geek living in San Francisco.", "statuses_count": 3916,
"friends_count": 362, "display_url": "themattharris.com",
"screen_name": "themattharris", ... } Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 71
72. Following a user through twitter.com Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 72
73. Following a user through twitter.com Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 73
74. Following with @anywhere Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 74
75. Tweeting with @anywhere Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 75
76. Is there an easier way?Monday, July 18, 11 76
77. The Follow Button Follow @themattharris Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 77
78. Overview Sending a Tweet Reviewing the technology Making it
easier Following a user Doing more Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 78
79. Web Intents Tweet Follow Retweet Reply Favorite Open Web
Camp III Stanford University July 16, 2011Monday, July 18, 11
79
80. Streamlined UI and similar pattern to perform each
intentMonday, July 18, 11 80
81. Web Intents Tweet http://twitter.com/intent/tweet Follow
http://twitter.com/intent/user Retweet
http://twitter.com/intent/retweet Reply
http://twitter.com/intent/reply Favorite
http://twitter.com/intent/favorite Open Web Camp III Stanford
University July 16, 2011Monday, July 18, 11 81
82. JavaScript Events Open Web Camp III Stanford University
July 16, 2011Monday, July 18, 11 82
83. JavaScript Events twttr.events.bind(click, function(event)
{ // Do something there }); twttr.events.bind(favorite,
function(event) { // Do something there });
twttr.events.bind(tweet, function(event) { // Do something there
}); twttr.events.bind(retweet, function(event) { // Do something
there }); twttr.events.bind(follow, function(event) { // Do
something there }); Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 83
84. JavaScript Events - Analytics function log_event(evt,
label) { if (evt) { pageTracker._trackEvent(twitter_web_intents,
evt.type, label); } } twttr.events.bind(click,
function(intent_event) { log_event(intent_event,
intent_event.region); }); twttr.events.bind(tweet,
function(intent_event) { log_event(intent_event, tweet); });
twttr.events.bind(retweet, function(intent_event) {
log_event(intent_event, intent_event.data.source_tweet_id); });
twttr.events.bind(favorite, function(intent_event) {
log_event(intent_event, favorite); }); twttr.events.bind(follow,
function(intent_event) { log_event(intent_event,
intent_event.data.user_id + " (" + intent_event.data.screen_name +
")"); }); Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 84
85. Invert the modelMonday, July 18, 11 85
86. Invert the model Start simple and then add
complexityMonday, July 18, 11 86
87. Before curl https://api.twitter.com/1/statuses/update.json
-d status="Working on the Open Web Camp III presentation" -d
oauth_token=12345- abcdefghijkl -d oauth_secret=abc123def456
................ Open Web Camp III Stanford University July 16,
2011Monday, July 18, 11 87
88. Before curl https://api.twitter.com/1/statuses/update.json
-d status="Working on the Open Web Camp III presentation" -d
oauth_token=12345- abcdefghijkl -d oauth_secret=abc123def456
................ After Tweet Open Web Camp III Stanford University
July 16, 2011Monday, July 18, 11 88
89. We give you the tools to build great integrationsMonday,
July 18, 11 89
90. Finding out more https://dev.twitter.com/docs/tweet-button
https://dev.twitter.com/docs/follow-button
https://dev.twitter.com/docs/intents
https://dev.twitter.com/docs/intents/events Open Web Camp III
Stanford University July 16, 2011Monday, July 18, 11 90
91. Twitter for Websites @danwrong @brianellin @benward
@chanian @zprad @rsarver @ded @richardhenry @connors @kpk @binder
Open Web Camp III Stanford University July 16, 2011Monday, July 18,
11 91
92. Questions?Monday, July 18, 11 92
93. http://twitter.com/intent/user?screen_name=themattharris
http://twitter.com/intent/user?screen_name=jasoncosta Open Web Camp
III Stanford University July 16, 2011Monday, July 18, 11 93