Introducing Amplify

appendTo
appendToappendTo
INTRODUCING AMPLIFY
      by Scott González
GOALS



• Solve   real problems based on existing projects

• Easy   to drop into existing projects
INITIAL FEATURES


• Persistent   client-side storage

• Mocking   ajax requests

• Manipulating    data from ajax requests
OPEN SOURCE


• Dual   licensed

 • MIT

 • GPLv2
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
STORE


• Falls   back to in-memory storage

  • Never    worry about whether a persistent store exists

• Support    for time-based expiration of data

• Extensible
STORE API

• store   a value

  • amplify.store(   key, value )

• get   a value

  • amplify.store(   key )

  • amplify.store()   // all values
STORE API

• expiration

  • amplify.store(   key, value, { expires: 1000 } )

• specific   store

  • amplify.store.sessionStorage(    key, value )

  • amplify.store.sessionStorage(    key )
REQUEST

• abstraction    for requesting data

• separates   requesting data from:

  • retrieving   data

  • parsing   data

  • caching   data
REQUEST API


• define   a request

 • amplify.request.define(    resourceId, resourceType, settings )

• make   a request

 • amplify.request(   resourceId, data, callback )
REQUEST API


amplify.request.define( “my-data”, “ajax”, {
  url: “/path/to/resource”,
  dataType: “json”
});
REQUEST API


amplify.request( “my-data”, { foo: “bar”, baz: “qux” },
 function( data ) {
   // do something awesome with data
 });
REQUEST API

amplify.request({
  resourceId: “my-data”,
  data: { foo: “bar”, baz: “qux” },
  success: function( data ) {},
  error: function( data ) {},
});
REQUEST TYPES


• ajax

• custom   one-off requests

• more    to come

• easy   to define new request types
REQUEST API


amplify.request.define( “echo”, function( settings ) {
  settings.success( settings.data );
  // success, error, data, resourceId
});
MOCKING REQUESTS


• real   request

  • amplify.request.define( “my-data”, “ajax”, ... )

• mock    request

  • amplify.request.define( “my-data”, function(       settings ) { ... } )
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
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
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 );
   }
 });
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
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
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 )
PUB/SUB API

• publish   a message

  • amplify.publish(   topic )

  • amplify.publish(   topic, arg1, arg2 )

• returns   boolean indicating whether any subscription returned
 false
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
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
1 of 25

Recommended

Bye bye $GLOBALS['TYPO3_DB'] by
Bye bye $GLOBALS['TYPO3_DB']Bye bye $GLOBALS['TYPO3_DB']
Bye bye $GLOBALS['TYPO3_DB']Jan Helke
214 views24 slides
Introduction to CouchDB by
Introduction to CouchDBIntroduction to CouchDB
Introduction to CouchDBOpusVL
1.4K views19 slides
Transforming WordPress Search and Query Performance with Elasticsearch by
Transforming WordPress Search and Query Performance with Elasticsearch Transforming WordPress Search and Query Performance with Elasticsearch
Transforming WordPress Search and Query Performance with Elasticsearch Taylor Lovett
8K views36 slides
You Got React.js in My PHP by
You Got React.js in My PHPYou Got React.js in My PHP
You Got React.js in My PHPTaylor Lovett
7.2K views31 slides
Week3 adb by
Week3 adbWeek3 adb
Week3 adbDavid Sherlock
582 views15 slides
Web Application Development using PHP Chapter 7 by
Web Application Development using PHP Chapter 7Web Application Development using PHP Chapter 7
Web Application Development using PHP Chapter 7Mohd Harris Ahmad Jaal
11 views15 slides

More Related Content

What's hot

Modernizing WordPress Search with Elasticsearch by
Modernizing WordPress Search with ElasticsearchModernizing WordPress Search with Elasticsearch
Modernizing WordPress Search with ElasticsearchTaylor Lovett
1.5K views39 slides
Saving Time with WP-CLI by
Saving Time with WP-CLISaving Time with WP-CLI
Saving Time with WP-CLITaylor Lovett
13.6K views34 slides
HTML5 Hacking - Yahoo! Open Hack Day by
HTML5 Hacking - Yahoo! Open Hack DayHTML5 Hacking - Yahoo! Open Hack Day
HTML5 Hacking - Yahoo! Open Hack DayTed Drake
806 views37 slides
WordPress Café: Using WordPress as a Framework by
WordPress Café: Using WordPress as a FrameworkWordPress Café: Using WordPress as a Framework
WordPress Café: Using WordPress as a FrameworkExove
1.1K views46 slides
Perl in the Real World by
Perl in the Real WorldPerl in the Real World
Perl in the Real WorldOpusVL
661 views13 slides
MuleSoft ESB Filtering data instead of Looping by
MuleSoft ESB Filtering data instead of LoopingMuleSoft ESB Filtering data instead of Looping
MuleSoft ESB Filtering data instead of Loopingakashdprajapati
175 views3 slides

What's hot(20)

Modernizing WordPress Search with Elasticsearch by Taylor Lovett
Modernizing WordPress Search with ElasticsearchModernizing WordPress Search with Elasticsearch
Modernizing WordPress Search with Elasticsearch
Taylor Lovett1.5K views
Saving Time with WP-CLI by Taylor Lovett
Saving Time with WP-CLISaving Time with WP-CLI
Saving Time with WP-CLI
Taylor Lovett13.6K views
HTML5 Hacking - Yahoo! Open Hack Day by Ted Drake
HTML5 Hacking - Yahoo! Open Hack DayHTML5 Hacking - Yahoo! Open Hack Day
HTML5 Hacking - Yahoo! Open Hack Day
Ted Drake806 views
WordPress Café: Using WordPress as a Framework by Exove
WordPress Café: Using WordPress as a FrameworkWordPress Café: Using WordPress as a Framework
WordPress Café: Using WordPress as a Framework
Exove1.1K views
Perl in the Real World by OpusVL
Perl in the Real WorldPerl in the Real World
Perl in the Real World
OpusVL661 views
MuleSoft ESB Filtering data instead of Looping by akashdprajapati
MuleSoft ESB Filtering data instead of LoopingMuleSoft ESB Filtering data instead of Looping
MuleSoft ESB Filtering data instead of Looping
akashdprajapati175 views
Infinispan,Lucene,Hibername OGM by JBug Italy
Infinispan,Lucene,Hibername OGMInfinispan,Lucene,Hibername OGM
Infinispan,Lucene,Hibername OGM
JBug Italy1.4K views
Ansible for large scale deployment by Karthik .P.R
Ansible for large scale deploymentAnsible for large scale deployment
Ansible for large scale deployment
Karthik .P.R3.9K views
Hashicorp @ JUST EAT - Part 2 by Andrew Brown
Hashicorp @ JUST EAT - Part 2Hashicorp @ JUST EAT - Part 2
Hashicorp @ JUST EAT - Part 2
Andrew Brown467 views
Best Practices for WordPress by Taylor Lovett
Best Practices for WordPressBest Practices for WordPress
Best Practices for WordPress
Taylor Lovett11.2K views
5分で説明する Play! scala by masahitojp
5分で説明する Play! scala5分で説明する Play! scala
5分で説明する Play! scala
masahitojp2.5K views
Modernizing WordPress Search with Elasticsearch by Taylor Lovett
Modernizing WordPress Search with ElasticsearchModernizing WordPress Search with Elasticsearch
Modernizing WordPress Search with Elasticsearch
Taylor Lovett51.2K views
Best Practices for Building WordPress Applications by Taylor Lovett
Best Practices for Building WordPress ApplicationsBest Practices for Building WordPress Applications
Best Practices for Building WordPress Applications
Taylor Lovett6.1K views
DSpace UI Prototype Challenge: Spring Boot + Thymeleaf by Tim Donohue
DSpace UI Prototype Challenge: Spring Boot + ThymeleafDSpace UI Prototype Challenge: Spring Boot + Thymeleaf
DSpace UI Prototype Challenge: Spring Boot + Thymeleaf
Tim Donohue1.4K views
April 2010 - JBoss Web Services by JBug Italy
April 2010 - JBoss Web ServicesApril 2010 - JBoss Web Services
April 2010 - JBoss Web Services
JBug Italy566 views
Spring java config by Sukjin Yun
Spring java configSpring java config
Spring java config
Sukjin Yun1K views
CouchDB for Web Applications - Erlang Factory London 2009 by Jason Davies
CouchDB for Web Applications - Erlang Factory London 2009CouchDB for Web Applications - Erlang Factory London 2009
CouchDB for Web Applications - Erlang Factory London 2009
Jason Davies2.2K views
Advanced moduledevelopment d6_slideshare by Opevel
Advanced moduledevelopment d6_slideshareAdvanced moduledevelopment d6_slideshare
Advanced moduledevelopment d6_slideshare
Opevel859 views

Similar to Introducing Amplify

初心者向けGAE/Java説明資料 by
初心者向けGAE/Java説明資料初心者向けGAE/Java説明資料
初心者向けGAE/Java説明資料Shinichi Ogawa
3.3K views60 slides
Building APIs in an easy way using API Platform by
Building APIs in an easy way using API PlatformBuilding APIs in an easy way using API Platform
Building APIs in an easy way using API PlatformAntonio Peric-Mazar
293 views90 slides
Apache Solr crash course by
Apache Solr crash courseApache Solr crash course
Apache Solr crash courseTommaso Teofili
25.6K views72 slides
Where to save my data, for devs! by
Where to save my data, for devs!Where to save my data, for devs!
Where to save my data, for devs!SharePoint Saturday New Jersey
933 views33 slides
Gaej For Beginners by
Gaej For BeginnersGaej For Beginners
Gaej For BeginnersShinichi Ogawa
1.6K views50 slides
Tale of ISUCON and Its Bench Tools by
Tale of ISUCON and Its Bench ToolsTale of ISUCON and Its Bench Tools
Tale of ISUCON and Its Bench ToolsSATOSHI TAGOMORI
5.7K views28 slides

Similar to Introducing Amplify(20)

初心者向けGAE/Java説明資料 by Shinichi Ogawa
初心者向けGAE/Java説明資料初心者向けGAE/Java説明資料
初心者向けGAE/Java説明資料
Shinichi Ogawa3.3K views
Tale of ISUCON and Its Bench Tools by SATOSHI TAGOMORI
Tale of ISUCON and Its Bench ToolsTale of ISUCON and Its Bench Tools
Tale of ISUCON and Its Bench Tools
SATOSHI TAGOMORI5.7K views
The Future of Plugin Dev by Brandon Kelly
The Future of Plugin DevThe Future of Plugin Dev
The Future of Plugin Dev
Brandon Kelly740 views
In-browser storage and me by Jason Casden
In-browser storage and meIn-browser storage and me
In-browser storage and me
Jason Casden4.8K views
Build a Node.js Client for Your REST+JSON API by Stormpath
Build a Node.js Client for Your REST+JSON APIBuild a Node.js Client for Your REST+JSON API
Build a Node.js Client for Your REST+JSON API
Stormpath2.6K views
Web Services PHP Tutorial by Lorna Mitchell
Web Services PHP TutorialWeb Services PHP Tutorial
Web Services PHP Tutorial
Lorna Mitchell192.2K views
Velocity EU 2014 — Offline-first web apps by andrewsmatt
Velocity EU 2014 — Offline-first web appsVelocity EU 2014 — Offline-first web apps
Velocity EU 2014 — Offline-first web apps
andrewsmatt3.9K views
SharePoint 2014: Where to save my data, for devs! by Ben Steinhauser
SharePoint 2014: Where to save my data, for devs!SharePoint 2014: Where to save my data, for devs!
SharePoint 2014: Where to save my data, for devs!
Ben Steinhauser1.7K views
Designing a RESTful web service by Filip Blondeel
Designing a RESTful web serviceDesigning a RESTful web service
Designing a RESTful web service
Filip Blondeel2.6K views
jQuery Makes Writing JavaScript Fun Again (for HTML5 User Group) by Doris Chen
jQuery Makes Writing JavaScript Fun Again (for HTML5 User Group)jQuery Makes Writing JavaScript Fun Again (for HTML5 User Group)
jQuery Makes Writing JavaScript Fun Again (for HTML5 User Group)
Doris Chen9.5K views
Share point development 101 by Becky Bertram
Share point development 101Share point development 101
Share point development 101
Becky Bertram863 views
API Days Paris - Automatic Testing of (RESTful) API Documentation by Rouven Weßling
API Days Paris - Automatic Testing of (RESTful) API DocumentationAPI Days Paris - Automatic Testing of (RESTful) API Documentation
API Days Paris - Automatic Testing of (RESTful) API Documentation
Rouven Weßling438 views
Not Just ORM: Powerful Hibernate ORM Features and Capabilities by Brett Meyer
Not Just ORM: Powerful Hibernate ORM Features and CapabilitiesNot Just ORM: Powerful Hibernate ORM Features and Capabilities
Not Just ORM: Powerful Hibernate ORM Features and Capabilities
Brett Meyer19.7K views
hibernateormfeatures-140223193044-phpapp02.pdf by Patiento Del Mar
hibernateormfeatures-140223193044-phpapp02.pdfhibernateormfeatures-140223193044-phpapp02.pdf
hibernateormfeatures-140223193044-phpapp02.pdf

Introducing Amplify

  • 1. INTRODUCING AMPLIFY by Scott González
  • 2. GOALS • Solve real problems based on existing projects • Easy to drop into existing projects
  • 3. INITIAL FEATURES • Persistent client-side storage • Mocking ajax requests • Manipulating data from ajax requests
  • 4. OPEN SOURCE • Dual licensed • MIT • GPLv2
  • 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. STORE • Falls back to in-memory storage • Never worry about whether a persistent store exists • Support for time-based expiration of data • Extensible
  • 7. STORE API • store a value • amplify.store( key, value ) • get a value • amplify.store( key ) • amplify.store() // all values
  • 8. STORE API • expiration • amplify.store( key, value, { expires: 1000 } ) • specific store • amplify.store.sessionStorage( key, value ) • amplify.store.sessionStorage( key )
  • 9. REQUEST • abstraction for requesting data • separates requesting data from: • retrieving data • parsing data • caching data
  • 10. REQUEST API • define a request • amplify.request.define( resourceId, resourceType, settings ) • make a request • amplify.request( resourceId, data, callback )
  • 11. REQUEST API amplify.request.define( “my-data”, “ajax”, { url: “/path/to/resource”, dataType: “json” });
  • 12. REQUEST API amplify.request( “my-data”, { foo: “bar”, baz: “qux” }, function( data ) { // do something awesome with data });
  • 13. REQUEST API amplify.request({ resourceId: “my-data”, data: { foo: “bar”, baz: “qux” }, success: function( data ) {}, error: function( data ) {}, });
  • 14. REQUEST TYPES • ajax • custom one-off requests • more to come • easy to define new request types
  • 15. REQUEST API amplify.request.define( “echo”, function( settings ) { settings.success( settings.data ); // success, error, data, resourceId });
  • 16. MOCKING REQUESTS • real request • amplify.request.define( “my-data”, “ajax”, ... ) • mock request • amplify.request.define( “my-data”, function( settings ) { ... } )
  • 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. 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. 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. 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. 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. 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. PUB/SUB API • publish a message • amplify.publish( topic ) • amplify.publish( topic, arg1, arg2 ) • returns boolean indicating whether any subscription returned false
  • 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. 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

  1. \n
  2. \n
  3. \n
  4. \n
  5. \n
  6. \n
  7. \n
  8. \n
  9. \n
  10. \n
  11. \n
  12. \n
  13. \n
  14. \n
  15. \n
  16. \n
  17. \n
  18. \n
  19. \n
  20. \n
  21. \n
  22. \n
  23. \n
  24. \n
  25. \n