Using WordPress to develop Web Apps, and adding an API to WordPress

1. Web Apps for
the Masses
@davidscotttufts
davidscotttufts.com
Photo by razorray15

2. About Me
• Born and raised in Brazil
• Live in Grand Rapids, Michigan
• 1 beautiful wife
• 6 great kids (5 boys and 1 girl)
• Co-founder at Rocketwood
• Web Producer at RBC Ministries
• Developing KickPress, a WordPress plugin

3. The Sweet Smell of Success
In under 2 years with WordPress on odb.org
• From 2.1 million to 5 million page views per month
• From 0 to 140,000 subscribers to daily email
• From 0 to 100,000 mobile app sales
• From 0 to 90,000 Facebook fans
• Web donations increased 50%+
• 40% less hardware
• 30% savings
Graph by Francesco Schwarz

4. We are the 15.7%
Photo by Tim Wilson

5. WordPress Evolution
1. Blog
2. Multi-User
3. Custom Post Types
4. CMS
5. What’s next?
Illustration by Rob Green

6. Popular Web Apps

7. 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

8. They own your data!
Photo by Rob Young

9. WordPress Web Apps

10. With no API, users are limited in
how the can access their data
Illustration by Eric Tufts

11. Separating content
from presentation
Illustration by Eric Tufts

12. Illustration by Eric Tufts

14. No WordPress
core files or
database tables
were harmed in
the production
of this plugin
Photo by Sarah Fleming

15. KickPress allows for easy Custom
Post Type management
• Create new post types
• Assign Roles and Capabilities
per post type
• Manage custom workflows
• Extend post types with modules
Custom Post Types
Photo by Brad Coy

16. Advanced custom post type
management

17. Advanced roles and capabilities for
managing user permissions

18. 3 kinds of API requests to the server
1. // Request for a full page from the theme
kickpress_is_fullpage();
2. // Request for a page fragment via Ajax
kickpress_is_ajax();
3. // Remote API request or action
kickpress_is_remote_api();

19. 1. Full Page Requests

20. Triggering the KickPress API
API Parameters are appended to the end
of 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/02/18/wordcamp/api/edit/
{site}.com/2012/02/18/wordcamp/api/save/
{site}.com/2012/02/18/wordcamp/api/delete/
{site}.com/2012/02/18/wordcamp/api/bookmark/
{site}.com/2012/02/18/wordcamp/api/add_term[category]/featured/

21. 2. Ajax Requests

22. Theme Modifications
Add an extra conditional comment
to the top of these theme files:
header.php
footer.php
sidebar.php
<?php
if ( kickpress_is_ajax() ) { return; }
?>

23. Theme Modifications
Add a conditional blocks for any code that
should 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(); ?>

24. 3. Remote API Requests

25. Authentication
Every registered user is
assigned a “token” and a
“secret” to be used in
generating signatures for
making ReSTful OAuth
style API calls to the
Web App.
Photo by Jon Worth

26. Authentication credentials are
available on the user’s profile page

27. $token = '{token-from-profile-page}';
$secret = '{secret-from-profile-page}';
$timestamp = time();
$method = 'GET';
$host = 'www.{your domain}.com';
// Create the string to sign
$string_to_sign = $method . "n" . $host . "n" . $timestamp . "n";
// Calculate signature with SHA1 and base64-encoding
$signature = base64_encode(
hash_hmac( 'sha1', $string_to_sign, $secret, true )
);
$authentication_params = array(
'signature' => $signature,
'timestamp' => $timestamp,
'token' => $token
);
// Normalize the query string parameters
$query_parts = normalized_query_parameters( $authentication_params );
$query_string = implode('&', $query_parts);
// Build the URL for the remote API request
$url = 'http://' . $host . '/{post type}/api/{action}/?' . $query_string;
For more information: http://kickpress.org/documentation/api-authentication/

28. API Serialized Response
{
"status":"success",
"messages":{
"note":"Term Added"
},
"data":{
"terms":[{
"term_id":"7",
"name":"Featured",
"slug":"featured",
"taxonomy":"category",
"count":"26"
}]
}
}

30. Use KickPress to Build
your next Web App in
WordPress

31. The Beginning
http://kickpress.org/getting-started/