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.

WordCamp GR 2012 Web Apps for the Masses


Published on

Building web apps with WordPress

Published in: Technology
  • Be the first to comment

WordCamp GR 2012 Web Apps for the Masses

  1. 1. Web Apps for the Masses Photo by razorray15
  2. 2. We are the 16.7% Photo by Tim Wilson
  3. 3. WordPress Evolution 1. Blog 2. Multi-User 3. Custom Post Types 4. CMS 5. What’s next? Illustration by Rob Green
  4. 4. State of the Word 2012Slide from Matt Mullenweg’s presentation
  5. 5. Popular Web Apps
  6. 6. Features of Web Apps  Offer a service  Safe-keeping of your personal data  Access to your personal data through an API  Roles and permissions for controlled and/or restricted access
  7. 7. WordPress Web Apps
  8. 8. Building a WordPress Web Application Framework • Use the existing plugin framework • Build the plugin to be extendable • Build in a robust public facing API Photo by Pietro Zuco
  9. 9. WordPress App Stack1. WordPress Core2. Plugins, Themes, Actions, Filters & APIs.3. Custom: Post Types, Fields & Taxonomies4. Build a Web Application Framework Plugin5. Make Products—Bundled plugins and themes6. Build Web Apps—Registration, profiles, friending, subscriptions, public facing API, in-app social features, sharing, etc. Photo by Pietro Zuco
  10. 10. #1 Rule:No WordPresscore files ordatabase tablesshould be harmedin the productionof a plugin Photo by Sarah Fleming
  11. 11. • Module based App Engine• Public facing API• Custom post type & taxonomy manager• Custom roles & capabilities• Custom “related posts”• Custom workflows• Front end editingKickPress Features Photo by Brad Coy
  12. 12. Why APIs matter when building web apps, and why you should care.
  13. 13. With no API, users are limited in how the can access their data Illustration by Eric Tufts
  14. 14. Separating contentfrom presentation Illustration by Eric Tufts
  15. 15. Illustration by Eric Tufts
  16. 16. Sample User Interfaces
  17. 17. Advanced custom post type management
  18. 18. Advanced roles and capabilities for managing user permissions
  19. 19. API Requests3 kinds of requests to the server1. // Request for a full page from the theme kickpress_is_fullpage();2. // Request for a page fragment via Ajax kickpress_is_ajax();3. // Remote app request or action kickpress_is_remote_app();
  20. 20. 1. Full Page Requests
  21. 21. Triggering the KickPress APIAPI Parameters are appended to the endof the standard WordPress permalinks:{site}.com/how-to/ {Archive page for custom post type called “How To”}{site}.com/how-to/api/add/{site}.com/how-to/api/save/{site}.com/how-to/using-powerpoint/api/edit/More Examples:{site}.com/2012/08/18/wordcamp/api/edit/{site}.com/2012/08/18/wordcamp/api/save/{site}.com/2012/08/18/wordcamp/api/delete/{site}.com/2012/08/18/wordcamp/api/bookmark/{site}.com/2012/08/18/wordcamp/api/add_term[category]/featured/
  22. 22. 2. Ajax Requests
  23. 23. Theme ModificationsAdd an extra conditional commentto the top of these theme files: header.php footer.php sidebar.php<?php if ( kickpress_is_ajax() ) { return; }?>
  24. 24. Theme ModificationsAdd a conditional blocks for any code thatshould be ignored on AJAX requests:<?php get_header(); ?><?php if ( kickpress_is_fullpage() ) : ?> <div id="content-wrapper"><?php endif; ?><?php $post_type = get_post_type(); ?><?php get_template_part( loop, $post_type ); ?><?php $args = array( post_type, $post_type );<?php kickpress_ajax_reload( $args, content-wrapper‘ ); ?><?php kickpress_is_fullpage( </div>‘ ); ?><?php get_sidebar(); ?><?php get_footer(); ?>
  25. 25. 3. Remote API Requests
  26. 26. Authentication Two levels of remote authentication. • Remote apps • Registered users interacting with your site’s content remotely through authenticated web or mobile apps. Photo by Jon Worth
  27. 27. Remote Application Authentication
  28. 28. API Serialized Response{ "status":"success", "messages":{ "note":"Term Added" }, "data":{ "terms":[{ "term_id":"7", "name":"Featured", "slug":"featured", "taxonomy":"category", "count":"26" }] }}
  29. 29. Use KickPress to Build your next Web App in WordPress