Your visitors interact with content, not with your website. Content consistency is crucial to a successful user experience. Re-publishing is one option but it’s an inside-out action that relies on the authority controlling where the information goes. An API frees your data and the responsibility to where it is published and accessed. Mobile is a major consumer for your API but not every API is setup to handle the mass of requests coming from those devices. Learn how to mobile devices consume API’s with limited or low bandwidth and how to to tailor your API to be as efficient and effective as possible. http://environmentsforhumans.com/2012/doteduguru-summit/

1. Creating API’s for Mobile
Nick DeNardis

2. @nickdenardis
Associate Director of Web Communications
Wayne State University
http://wayne.edu/
Host of EDU Checkup
http://educheckup.com/
Curator of EDU Snippits
http://edusnippits.com/
Writer for .eduGuru
http://doteduguru.com/

3. Disclaimer
This talk is less about how to code an API but
more about the strategy behind creating a
flexible and resilient API.

4. API:
Application programming interface

5. Not just for robots.
http://www.flickr.com/photos/stevent/3241986538/

6. The API’s job is to
make the developer as
successful as possible
http://knowyourmeme.com/memes/i-hate-sandcastles-success-kid

7. Where isn’t it useful?
http://www.flickr.com/photos/daychokesnight/2149714792/

8. Too slow...
http://www.flickr.com/photos/toolmantim/6170448143/

9. Too complicated...
http://www.flickr.com/photos/toolmantim/6170448143/

10. Adds a layer
http://www.flickr.com/photos/jabb/6715983809/

11. Complications with mobile
“always on”

12. Mobile isn’t
going anywhere
1.45 Million devices per day
371,000 births per day
http://www.lukew.com/ff/entry.asp?1506

13. Mobile Data Traffic Expected To Rise 40-
Fold Over Next Five Years
http://techcrunch.com/2010/03/30/mobile-data-traffic-rise-40-fold/

14. Desktop
250 kb - Avg page weight
2.5 pages - Avg number per visit 1300
625 kb - Bandwidth per visit 975
650
Mobile 325
50 kb - Avg page weight
25 pages - Avg number per visit 0
Data
Desktop Mobile
1.25 mb - Bandwidth per visit

15. Mobile Desktop
40
30
Millions of
visitors 20
10
0
2009 2010 2011 2012 2013 2014 2015 2016 2017
http://wayne.edu/

16. The Mobile Web is Slow
And it’s mostly our fault

17. You can’t blame the network for everything
CSS
Images
Javascript
Initial HTML
Cell Latency
Time

18. Second Request
Images
New Content
Cell Latency
Time

19. Do less better

20. One size != fit all
https://api.twitter.com/1/
https://us2.api.mailchimp.com/1.3/
https://api.foursquare.com/v2/
https://api.instagram.com/v1/
https://www.salesforce.com/services/Soap/c/18.0
https://api.wayne.edu/v1/
Think versioning from the start

21. SOAP REST
The request: The request:
GET /StockPrice HTTP/1.1 GET /StockPrice/IBM HTTP/1.1
Host: example.org Host: example.org
Content-Type: application/soap+xml; charset=utf-8 Accept: text/xml
Content-Length: nnn Accept-Charset: utf-8
<?xml version="1.0"?> The response:
<env:Envelope xmlns:env="http://www.w3.org/
2003/05/soap-envelope" HTTP/1.1 200 OK
xmlns:s="http://www.example.org/stock-service"> Content-Type: text/xml; charset=utf-8
<env:Body> Content-Length: nnn
<s:GetStockQuote>
<s:TickerSymbol>IBM</s:TickerSymbol> <?xml version="1.0"?>
</s:GetStockQuote> <s:Quote xmlns:s="http://example.org/stock-
</env:Body> service">
</env:Envelope> <s:TickerSymbol>IBM</s:TickerSymbol>
<s:StockPrice>45.25</s:StockPrice>
The response: </s:Quote>
HTTP/1.1 200 OK
Content-Type: application/soap+xml; charset=utf-8
Content-Length: nnn
<?xml version="1.0"?>
<env:Envelope xmlns:env="http://www.w3.org/
2003/05/soap-envelope"
xmlns:s="http://www.example.org/stock-service">
<env:Body>
<s:GetStockQuoteResponse>
<s:StockPrice>45.25</s:StockPrice>
</s:GetStockQuoteResponse>
</env:Body>
4 kb vs 2 kb
</env:Envelope>
Round Trip

22. Stick to REST

23. http://www.flickr.com/photos/philmanker/3654636770/
XML sucks

24. Your best friend JSON
Easy to encode:
$arr = array('a' => 1, 'b' => 2, 'c' => 3, 'd' => 4, 'e' => 5);
json_encode($arr);
Easy to decode:
$json = '{"a":1,"b":2,"c":3,"d":4,"e":5}';
json_decode($json);
Javascript:
var myObject = eval('(' + json + ')');

25. Existing Resources
http://doteduguru.com/id7800-results-higher-ed-cms-usage-survey-2011.html

26. Not everything is in the CMS
Website
CMS
Gather &
Clean
Mobile
Website
Events
Shadow
storage
Mobile
App
LDAP
API
Webserver
Digital
Signage
Banner
Third
Party

27. Rolling your own API
Trust no one.

28. Create. Read. Update. Delete.
http://www.flickr.com/photos/fss/2181882493/

29. Start with a map
http://www.flickr.com/photos/56684679@N08/6155875352/

30. Read first.
http://www.flickr.com/photos/hackaday/4425372655/

31. GET /academic/colleges/listing
GET /academic/colleges/info
GET /academic/majors/listing
GET /academic/majors/info
GET /academic/classes/listing
GET /academic/classes/info
GET /parking/availability/listing
GET /parking/availability/info

32. The devil is in the details
Simple URL
Response code
Total count
Data container
Keep it
lightweight
91 KB

33. Use only what you need
Filters
Less data
41 KB

34. Writing data

35. POST /admissions/rfi/add
POST /admissions/visit/add
POST /admissions/application/add
POST /academic/colleges/add
POST /academic/colleges/edit
POST /academic/majors/add
POST /academic/majors/edit

36. Soft Delete
(keep all the data!)

37. POST /academic/colleges/remove
POST /academic/majors/remove
POST /academic/classes/remove
POST /parking/availability/remove

38. Authentication
/api/user/auth

39. Cache. Cache. Cache.

40. Professional cache
http://www.flickr.com/photos/carlos/2417032795/

41. APC
<?php
$bar = 'BAR';
apc_store('foo', $bar);
var_dump(apc_fetch('foo'));
?>

42. Ghetto cache
http://www.flickr.com/photos/basic_sounds/5779597720/

43. Static files
<?php
if ((is_file($_SERVER['SCRIPT_FILENAME'].'.json'))
&& (time()-filemtime($_SERVER['SCRIPT_FILENAME'].'.json') < 3600)) {
readfile($_SERVER['SCRIPT_FILENAME'].'.json');
exit;
}
// (the php script itself goes here)
echo $response;
$fp = fopen($_SERVER['SCRIPT_FILENAME'].'.json', 'w');
fwrite($fp, $response);
fclose($fp);
?>

44. HTML5 localStorage
if (typeof(localStorage) == 'undefined' ) {
alert('Your browser does not support HTML5 localStorage. Try upgrading.');
} else {
try {
localStorage.setItem("name", "Hello World!"); //saves to the database,
} catch (e) {
if (e == QUOTA_EXCEEDED_ERR) {
alert('Quota exceeded!'); //data wasn't successfully saved due to quota exceed
so throw an error
}
}
document.write(localStorage.getItem("name")); //Hello World!
localStorage.removeItem("name"); //deletes the matching item from the database
}
http://paperkilledrock.com/2010/05/html5-localstorage-part-one/

45. Expires header
<?php
header('Expires: '.gmdate('D, d M Y H:i:s GMT', time() + 3600));
?>
1 Month 1 Week 1 Day
Semesters Courses Events
Subjects Media Experts News
Degrees
Map Categories No Cache
Map Locations
Course Availability
Parking Availability

46. Our Stats
Feb 2011 - In production
2.5 million requests
48% from mobile
21% iOS
23% Android
66% Web
95% GET’s
16 ms average response time

47. Examples

48. Mobile news

49. maps/locations/listing
Google API
events/event/listing
directory/people/listing
academic/courses/listing

50. maps/category/listing
events/event/listing
maps/location/info

51. faculty/profile/info
go/url/info

52. Hackathon
Community through data
http://www.flickr.com/photos/hackny/5684887983/

53. Resources
• http://apigee.com/
• http://rubyonrails.org/
• http://cakephp.org/
• http://37signals.com/svn/posts/3018-api-design-for-humans
• http://broadcast.oreilly.com/2011/06/the-good-the-bad-the-ugly-of-rest-
apis.html
• http://sixrevisions.com/html/introduction-web-storage/
• http://webcomm.fiu.edu/2011/11/json-as-an-api-tool-and-why-its-awesome/
• http://doteduguru.com/id4579-results-higher-ed-cms-usage.html

54. Hackathons
• http://dschool.stanford.edu/blog/2012/01/27/hack-d-kicks-off-more-than-a-
dozen-projects-underway/
• http://civic.mit.edu/blog/schock/occupydata-hackathon-2-roundup
• http://newmed.media.mit.edu/health-and-wellness-innovation-2012
• http://nyuad.nyu.edu/hackathon/about/
• http://startup.berkeley.edu/hackathon/
• http://www.njit.edu/hackathon/
• http://www.lib.umich.edu/art-architecture-engineering-library/
announcements/48-hour-mobile-app-hackathon

55. Questions?
Don’t be shy.

56. Thank You
@nickdenardis
nick.denardis@gmail.com
http://nickdenardis.com/