Successfully reported this slideshow.

More Related Content

Related Audiobooks

Free with a 14 day trial from Scribd

See all

Introducing Amplify

  1. 1. INTRODUCING AMPLIFY by Scott González
  2. 2. GOALS • Solve real problems based on existing projects • Easy to drop into existing projects
  3. 3. INITIAL FEATURES • Persistent client-side storage • Mocking ajax requests • Manipulating data from ajax requests
  4. 4. OPEN SOURCE • Dual licensed • MIT • GPLv2
  5. 5. STORE • Persistent client-side storage • Cross-browser • IE 5+, Firefox 2+, Safari 4+, Chrome, Opera 10.5+ • iPhone 2+, Android 2+ • localStorage, sessionStorage, globalStorage, userData
  6. 6. STORE • Falls back to in-memory storage • Never worry about whether a persistent store exists • Support for time-based expiration of data • Extensible
  7. 7. STORE API • store a value • amplify.store( key, value ) • get a value • amplify.store( key ) • amplify.store() // all values
  8. 8. STORE API • expiration • amplify.store( key, value, { expires: 1000 } ) • specific store • amplify.store.sessionStorage( key, value ) • amplify.store.sessionStorage( key )
  9. 9. REQUEST • abstraction for requesting data • separates requesting data from: • retrieving data • parsing data • caching data
  10. 10. REQUEST API • define a request • amplify.request.define( resourceId, resourceType, settings ) • make a request • amplify.request( resourceId, data, callback )
  11. 11. REQUEST API amplify.request.define( “my-data”, “ajax”, { url: “/path/to/resource”, dataType: “json” });
  12. 12. REQUEST API amplify.request( “my-data”, { foo: “bar”, baz: “qux” }, function( data ) { // do something awesome with data });
  13. 13. REQUEST API amplify.request({ resourceId: “my-data”, data: { foo: “bar”, baz: “qux” }, success: function( data ) {}, error: function( data ) {}, });
  14. 14. REQUEST TYPES • ajax • custom one-off requests • more to come • easy to define new request types
  15. 15. REQUEST API amplify.request.define( “echo”, function( settings ) { settings.success( settings.data ); // success, error, data, resourceId });
  16. 16. MOCKING REQUESTS • real request • amplify.request.define( “my-data”, “ajax”, ... ) • mock request • amplify.request.define( “my-data”, function( settings ) { ... } )
  17. 17. MANIPULATING DATA • change the data format from third party services • change the status (success/error) of a request • many services always respond with a 200 OK HTTP status
  18. 18. REQUEST DECODERS • allowyou to parse data before calling the success or error callback • change the data passed to the callback • change the status of the request
  19. 19. REQUEST DECODERS amplify.request.define( “my-data”, “ajax”, { url: “/path/to/resource”, dataType: “json”, decoder: function( data, status, xhr, success, error ) { if ( data.errCode ) { error({ code: data.errCode, msg: data.errMsg }); } else { success( data ); } });
  20. 20. REQUEST CACHING • boolean: in-memory • number: in-memory with expiration (in ms) • “persist”: delegate to amplify.store() • “sessionStorage”: delegate to amplify.store.sessionStorage() • easy to create new cache types
  21. 21. PUB/SUB • not on initial list of features • we usually use custom events in jQuery • needed a simple system to post messages for amplify.request
  22. 22. PUB/SUB API • subscribe to a message • amplify.subscribe( topic, callback ) • amplify.subscribe( topic, context, callback ) • amplify.subscribe( topic, callback, priority ) • amplify.subscribe( topic, context, callback, priority )
  23. 23. PUB/SUB API • publish a message • amplify.publish( topic ) • amplify.publish( topic, arg1, arg2 ) • returns boolean indicating whether any subscription returned false
  24. 24. REQUEST MESSAGES • request.before, request.before.ajax • do something before a request • prevent a request • request.success, request.error, request.complete • do something after a request
  25. 25. AMPLIFY LINKS • http://github.com/appendto/amplify • http://amplifyjs.com • http://groups.google.com/group/amplifyjs • http://swarm.amplifyjs.com/user/amplify • irc://freenode/amplify.js

Editor's Notes

  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • ×