Api

723 views

Published on

People using your web app also use many other online services. You'll often want to pull data from those other services into your app, or publish data from your app out to other services. In this talk, Randy will explain the terminology you need to know, share best practices and techniques for integrating, and walk through two real-world examples. You'll leave with code snippets to help you get started integrating.

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
723
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
15
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Api

  1. 1. Integrating WithThird-Party APIs Randy Hoyt @randyhoyt
  2. 2. Overview• APIs: Defined• Three Examples: 1. Get Treehouse Badges 2. Get ShopLocket Products 3. Post Facebook & Twitter Updates• Best Practices @randyhoyt
  3. 3. API
  4. 4. Application Programming Interface
  5. 5. A point where two systems, subjects, organizations, etc., meet and interact.Interface, http://dictionary.com/browse/interface
  6. 6. [Keyboard]
  7. 7. [Remote Control]
  8. 8. [Remote Control]
  9. 9. [Lock and Key]
  10. 10. An interface for software components to communicate with each other.Wikipedia: API, http://trhou.se/defineAPI
  11. 11. API Examples• Android SDK: Camera API @randyhoyt
  12. 12. import android.hardware.Camera;Camera.getNumberOfCameras();Camera.open(cameraId);
  13. 13. API Examples• Android SDK: Camera API• WordPress: Plugin API @randyhoyt
  14. 14. <?php/*Plugin Name: Treehouse BadgesDescription: Displays the badges ...Version: 1.0*/?>add_action(init,treehouse_badges_init);...
  15. 15. API Examples• Android SDK: Camera API• WordPress: Plugin API• HTML5: Canvas API @randyhoyt
  16. 16. var canvas = document.getElementById("canvas");var context = canvas.getContext("2d");context.fillRect(10, 10, 40, 380, "#000000");context.drawImage(img, x, y, 100, 77);
  17. 17. Web APIs
  18. 18. REST
  19. 19. Representational State Transfer
  20. 20. RESTful API
  21. 21. Example #1: Treehouse
  22. 22. [Treehouse screenshot]
  23. 23. JavaScript Object Notation: Text-based open standard designed for human-readable data interchange.Wikipedia: JSON, http://trhou.se/defineJSON
  24. 24. { "firstName": "John", "lastName": "Smith", "address": { "streetAddress": "21 2nd Street", "city": "New York", "state": "NY", "postalCode": 10021 }, "phoneNumber": [ { "type": "home", "number": "212 555-1234" }, { "type": "fax", "number": "646 555-4567" } ] }Wikipedia: JSON, http://trhou.se/defineJSON
  25. 25. [Treehouse JSON]
  26. 26. [HTML]
  27. 27. Asynchronous JavaScript and XML: Technique used by the browser to retrieve data from a server in the background without interfering with the existing pageWikipedia: Ajax, http://trhou.se/defineAJAX
  28. 28. [AJAX Request Code]
  29. 29. [Badge Code]
  30. 30. [Badge Display]
  31. 31. <?php$curl = curl_init();curl_setopt_array($curl, array( CURLOPT_RETURNTRANSFER => 1, CURLOPT_URL => http://teamtreehou...));$resp = curl_exec($curl);curl_close($curl);?>
  32. 32. GET  Request  with  HTTPfulHTTPful, http://phphttpclient.com/
  33. 33. GET  Request  with  HTTPartyHTTParty, http://httparty.rubyforge.org/
  34. 34. GET  Request  with  WordPress  HTTP  APIWordPress, http://codex.wordpress.org/HTTP_API
  35. 35. API Questions• Does it have to be real time?• What if something goes wrong? @randyhoyt
  36. 36. Example #2: ShopLocket
  37. 37. [Screenshot of WP]
  38. 38. [Screenshot of WordPress]
  39. 39. [Screenshot of Product Picker]
  40. 40. [Screenshot of Product Picker]
  41. 41. [Screenshot of Shortcode]
  42. 42. [Screenshot of Website]
  43. 43. Authentication
  44. 44. OAuth An open protocol to allow secure authorization in a simple and standard method from web, mobile and desktop applications.OAuth, http://oauth.net/
  45. 45. App ID5f4a89f2d6655ac7a8859343d6d152579410e7b659b200e00aaf3721cf46269eApp Secretfa963a1ef3702c16d934500f7621697e2d6bfd05d3ef1751a32bdeb2a0599020
  46. 46. [ShopLocket]
  47. 47. [ShopLocket Login]
  48. 48. [ShopLocket]
  49. 49. /? code = 53fe... & state = auth...
  50. 50. $args: code = $_GET["code"] app id = [app id] app secret = [app secret] [GET Request]$response = wp_remote_post( https://www.shoplocket.com/ . oauth/token, $args );
  51. 51. Token:310826b20a535a422ccaa46d65c7065f83e403b9218a38962ab4e43021b93585
  52. 52. [Token]
  53. 53. API Questions• Does it have to be real time?• What if something goes wrong? @randyhoyt
  54. 54. [Refresh Button]
  55. 55. Example #3: Facebook & Twitter
  56. 56. [Screenshot of Cultivatr]
  57. 57. [Screenshot of Edit Screen]
  58. 58. [Screenshot of Date Picker]
  59. 59. [Diagram]
  60. 60. API Questions• Does it have to be real time?• What if something goes wrong? @randyhoyt
  61. 61. REST: Types of Requests• GET (Read)• POST (Create)• PUT (Update)• DELETE (Delete) @randyhoyt
  62. 62. require  ../tmhOAuth.php; require  ../tmhUtilities.php; $tw  =  new  tmhOAuth(array(    consumer_key        =>  APP_ID,    consumer_secret  =>  APP_SECRET,    user_token            =>  A_USER_TOKEN,    user_secret          =>  A_USER_SECRET, )); $code  =  $tw-­‐>request(                        POST,                        $tw-­‐>url(1/statuses/update),                        array(status  =>  My  Tweet)                  );Twitter Libraries, https://dev.twitter.com/docs/twitter-libraries
  63. 63. Best Practices
  64. 64. Best Practices• Read the Documentation• Use Available Libraries• Log Everything @randyhoyt
  65. 65. Questions? @randyhoyt

×