Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

fowa miami

902 views

Published on

Future of Web Apps Miami, February 2009. Deep dive into the Yahoo! Application Platform.

Published in: Technology
  • Be the first to comment

  • Be the first to like this

fowa miami

  1. 1. Scaling Open Jonathan LeBlanc – Technology Evangelist Yahoo! Developer Network – Partner Integrations Slides http://www.slideshare.net/jleblanc/future-of-web-apps-miami-fl-february-2009
  2. 2. <ul><li>YAP Applications What’s a YAP Application? </li></ul>
  3. 9. <ul><li>YAP Applications How do I get started? </li></ul>
  4. 10. <ul><li>Runs on YAP </li></ul><ul><li>Supports 2- & 3- legged OAuth </li></ul><ul><li>Supports OpenSocial 0.8 JavaScript APIs </li></ul>Open Applications
  5. 11. Open Application - Views Small View Large View
  6. 12. Open Application – Small View
  7. 13. Open Application – Large View
  8. 14. <ul><li>http://developer.yahoo.com/dashboard </li></ul>
  9. 15. <ul><li>http://developer.yahoo.com/dashboard </li></ul>
  10. 19. <ul><li>Runs off platform </li></ul><ul><li>Supports 2- & 3-legged OAuth </li></ul><ul><li>Does not contain views </li></ul><ul><li>Requires users to authenticate session </li></ul>OAuth Applications
  11. 20. <ul><li>http://developer.yahoo.com/dashboard </li></ul>
  12. 21. <ul><li>http://developer.yahoo.com/dashboard </li></ul>
  13. 27. <ul><li>YAP Code Dive What can you do with YAP? </li></ul>
  14. 28. <ul><li>YAP Code Dive PHP SDK </li></ul>
  15. 29. Used For: - Public user data and open APIs PHP SDK – 2-Legged OAuth Initialization
  16. 30. <ul><li>Used For: </li></ul><ul><li>Private data access </li></ul>PHP SDK – 3-Legged OAuth Initialization
  17. 31. 3-Legged OAuth getSessionedUser (session) getOwner (session) getUser (session) query (session) getPresence (user) setPresence (user) listUpdates (user) listConnectionUpdates (user) insertUpdate (user) deleteUpdate (user) loadProfile (user) getConnections (user) getContacts (user) setSmallView (user) 2-Legged OAuth setSmallView (application) query (application) PHP SDK – Available Methods
  18. 32. PHP SDK – Create a User Update
  19. 33. PHP SDK – Set the Status of a User
  20. 34. <ul><li>YAP Code Dive Yahoo! Markup Language (YML) </li></ul>
  21. 35. YML Tags (Large View) yml:a yml:ad yml:audio yml:form yml:friend-selector yml:if-env yml:message yml:name yml:profile-pic yml:pronoun yml:share yml:swf yml:user-badge   YML Lite Tags (Small View) yml:a yml:audio yml:form yml:if-env yml:name yml:profile-pic yml:pronoun yml:user-badge YML – Available Tags
  22. 36. YML:A Tab Sample - Controller
  23. 37. YML:A Tab Sample – Tab Construction
  24. 38. YML:A Tab Sample - Product
  25. 39. YML:A Small View Update Sample
  26. 40. YML:A Small View Update Sample
  27. 41. <ul><li>YAP Code Dive Yahoo! Query Language (YQL) </li></ul>
  28. 42. YQL – Running a Query
  29. 43. <ul><li>YAP Code Dive Caja </li></ul>
  30. 44. Caja – JavaScript Before Cajoling
  31. 45. Caja – JavaScript After Cajoling
  32. 46. Caja - IFrame Security Concerns <ul><li>IFrame Concerns </li></ul><ul><li>Drive-by downloads </li></ul><ul><li>No real content restrictions </li></ul><ul><li>Other known exploits </li></ul><ul><li>Caja Implementation </li></ul><ul><li>Blacklist all / Whitelist some model </li></ul><ul><li>Secure OpenSocial container </li></ul>
  33. 47. Caja – Best Practices <ul><li>Use OpenSocial JavaScript standards </li></ul><ul><li>Use W3C standards </li></ul><ul><li>Use YML wherever possible </li></ul><ul><li>Unit test all JavaScript </li></ul><ul><li>Read the documentation (http://developer.yahoo.com/yos) </li></ul><ul><li>Participate in the forums (http://developer.yahoo.net/forum/) </li></ul>
  34. 48. Caja Practical – Running an AJAX Request
  35. 49. Caja Practical – Working with JSON
  36. 50. Caja Practical – Assigning Click Handlers <ul><li>Caja client side sanitizer strips JavaScript when inserted in DOM following AJAX requests </li></ul><ul><li>How do I assign click handlers then? </li></ul><ul><li>Given: DOM Node with an ID </li></ul><ul><li><div id=‘myClickDiv’>Click Me!</div> </li></ul>
  37. 51. Caja Practical – Assigning Click Handlers Step 1 – Assign click handler after innerHTML is set
  38. 52. Caja Practical – Assigning Click Handlers Step 2 – Define your callback function
  39. 53. <ul><li>YAP Code Dive Common Questions </li></ul>
  40. 54. <ul><li>I have an existing OpenSocial application. How do I get started? </li></ul><ul><li>I have an existing Facebook application. How do I get started? </li></ul><ul><li>How do I authenticate OAuth using JavaScript? </li></ul><ul><li>What is a Java Module Envelope error and how do I fix it? </li></ul><ul><li>Plans for other SDKs besides PHP and AS3? </li></ul><ul><li>How do users find my application? </li></ul>Common Questions – Q & A
  41. 55. <ul><li>Thank You Questions? </li></ul>

×