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.

Wordpress as a Backend

1,402 views

Published on

With the release of the WordPress JSON API expected later this year, WordPress is primed to serve as a viable backend for single-page web applications of the future. The presentation will explain the benefits of using WordPress in this context and include a short demonstration to show how WordPress can be integrated in a typical single-page application technology stack.

Published in: Technology
  • Be the first to comment

Wordpress as a Backend

  1. 1. WordPress as a Backend WordCamp Dayton 2015 - Andrew Duthie
  2. 2. About Me • JavaScript Engineer at Automattic • Co-Host of WordPress Cincinnati Meetup group • Previously worked at a local agency building custom WordPress themes
  3. 3. Web Sites vs Web Apps
  4. 4. Web Sites are documents
  5. 5. Web Apps are interactive
  6. 6. Speed Matters • With JavaScript, you have the opportunity to render optimistically • Even artificial content can give users the perception of speed
  7. 7. JSON REST API
  8. 8. JSON JavaScript Object Notation { "id": 1, "type": "post", "slug": "hello-world", "link": "http://wordpress.dev/hello-world/", "guid": { "rendered": “http://wordpress.dev/?p=1" }, "date": "2014-08-14T00:02:39", "modified": "2014-08-14T00:02:39", "title": { "rendered": "Hello world!” }, "content": { "rendered": "<p>Welcome to WordPress.</p>" }, "excerpt": { "rendered": "<p>Welcome to WordPress.</p>” }, "author": 1, "featured_image": 0, "comment_status": "open", "ping_status": "open", "sticky": false, "format": "standard" }
  9. 9. REST Representational State Transfer Action Endpoint HTTP Verb List /posts/ GET Read /posts/1 GET Create /posts/ POST Update /posts/1 PUT / PATCH Delete /posts/1 DELETE
  10. 10. API Application Programming Interface An API is an contract by which a programmer can interact with a particular service
  11. 11. WordPress Data Story XML-RPC API • Verbose • Difficult to work with XML-RPC JSON <array> <data> <value><string>Hello</string></value> <value><string>World</string></value> </data> </array> [ “Hello”, “World” ]
  12. 12. WordPress Data Story WordPress.com / Jetpack REST API • Simple to set up • Secure and mature • Requires Jetpack • Extra network hop
  13. 13. WordPress Data Story admin-ajax.php • Ad hoc endpoints • Manually configured
  14. 14. WordPress JSON API
  15. 15. WordPress JSON API • Alternative to XML-RPC • REST endpoints • Extendable • Expected later this year • Available now as a plugin
  16. 16. WordPress JSON API Querying /wp-json/wp/posts?posts_per_page=10 http://codex.wordpress.org/Class_Reference/WP_Query http://wp-api.org/#posts_retrieve-posts /wp-json/wp/posts?paged=2
  17. 17. WordPress JSON API Registering Endpoints register_json_route( ‘my-plugin', '/actions', array( ‘methods' => WP_JSON_Server::READABLE, ‘callback' => array( $this, 'get_actions' ), ) ); register_post_type( ‘movie’, array(
 // …
 ‘show_in_json’ => true, ‘json_base’ => ‘movies’ ) );
  18. 18. WordPress JSON API Authentication • Cookie Authentication • OAuth1 • Basic Authentication http://wp-api.org/guides/authentication.html
  19. 19. WordPress JSON API WP-API.js • Official JavaScript library • Backbone models and collections • Transparent nonce handling https://github.com/WP-API/client-js
  20. 20. Use Cases • Single-page web apps • Mobile apps • Widgets • JavaScript themes • Other technology stacks
  21. 21. Demo https://github.com/aduth/wordcamp-popular-movies
  22. 22. Thanks! Questions?

×