KEMBAR78
Using WordPress as your application stack | PPTX
Using WordPress as 
your application stack 
WHY AND HOW
@me 
Senior Full Stack WordPress Developer 
Plugin author of Author Avatars List http://wordpress.org/plugins/author-avatars/ 
and WP Site Verification tool http://wordpress.org/plugins/wp-site-verification-tool/ 
Slides @ http://www.slideshare.net/pbearne
Why WordPress? 
•Stable 
•Supported 
•Community 
•Scales
Why not WordPress? 
•Code debt 
•PHP 
•Has PHP global’s 
•Not sexy
23% 
OF THE SITES IN WHOLE INTERNET
34,000 
PLUG-INS
2,800 
THEMES
How 
•Actions and filters 
•JSON API 
•jQuery - Backbone 
•Template hierarchy 
•Custom post types
Filter 
add_filter(‘fliter_name’, ‘function_to_run’); 
Function function_to_run( $var ){ 
$var .= ‘hello world’; 
return $var; 
} 
http://codex.wordpress.org/Plugin_API#Filters
Action 
add_action(‘action_name’, ‘function_to_run’); 
Function function_to_run( $var = null ){ 
echo ‘hello world’; 
} 
http://codex.wordpress.org/Plugin_API#Actions
Ajax Route 
/** 
* Register a rewrite endpoint for the API. 
*/ 
function prefix_add_api_endpoints() { 
add_rewrite_tag( '%api_item_id%', '([0-9]+)' ); 
add_rewrite_rule( 'api/items/([0-9]+)/?', 
'index.php?api_item_id=$matches[1]', 'top' ); 
} 
add_action( 'init', 'prefix_add_api_endpoints' ); 
https://10up.github.io/Engineering-Best-Practices/php/#ajax-endpoints
Ajax handler 
function prefix_do_api() { 
global $wp_query; 
$item_id = $wp_query->get( 'api_item_id' ); 
if ( ! empty( $item_id ) ) { 
$response = array(); 
// Do stuff with $item_id 
wp_send_json( $response ); 
} 
} 
add_action( 'template_redirect', 'prefix_do_api' );
JSON API wordpress.com 
Part of the Jetpack plug-in 
http://developer.wordpress.com/docs/api/ 
https://developer.wordpress.com/docs/api/console/ 
End point 
https://public-api.wordpress.com/rest/v1/ 
e.g. 
https://public-api. 
wordpress.com/rest/v1/sites/authoravatars.wordpress.com/
JSON API wp.org (self host) 
Part of next version of core (currently plug-in) 
http://wp-api.org/ 
End point 
https://domain.com/wp-json/
JSON API wp-api.org/ v. WP.com 
WP.com 
Wp-api.org 
Caching 
On you server 
Little load on your servers 
Extendable 
Access to WordPress.com user and stats 
More complete 
The API’s don’t match (yet)
BackBone 
Included with WordPress  
To just load it 
wp_enqueue_script( ‘backbone’ ); 
Or better still load as a dependency of your script 
wp_enqueue_script( ‘myscript’, ‘path/to/script, array( 'backbone' ) ); 
https://github.com/tlovett1/_s_backbone
Template Hierarchy 
The order Wordpress load its template files 
http://codex.wordpress.org/Template_Hierarchy
Template Hierarchy
Custom post types 
The main logical data object 
in WordPress 
The standard types are : 
post, page, media 
add_action( 'init', 'create_post_type' ); 
function create_post_type() { 
register_post_type( 
'acme_product', 
array( 'labels' => array( 
'name' => __( 'Products' ), 
'singular_name' => __( 'Product' ) 
), 
'public' => true, 
'has_archive' => true, ) 
); 
} 
http://codex.wordpress.org/Post_Types
Custom metadata 
The data linked to a post object 
Text or serialized data 
Use CMB2 to easily create admin forms 
Hide the metadata from admin by 
starting the id with an “_” 
$meta_boxes[ 'tombstone_page_metabox' ] = array( 
'id' => __( 'tombstone_page_metabox', 
Config::get_text_domain() ), 
'title' => __( 'Tombstone Details', 
Config::get_text_domain() ), 
'object_types' => array( self::get_tombstone_post_type() ), 
https://github.com/WebDevStudios/CMB2 
// Post types 
'context' => 'normal', 
'priority' => 'high', 
'show_names' => true, // Show field names on the left 
'fields' => array( 
array( 
'name' => __( 'Tag line', Config::get_text_domain() 
), 
'desc' => __( 'Enter the pull Quote', 
Config::get_text_domain() ), 
'id' => Config::_get_prefix() . 'tagline', 
'type' => 'textarea_small', 
'attributes' => array( 
'style' => 'width:100%;', 
), 
), 
) 
);
Call external API and cache 
Use the internal 
wp_remote_get() get remote data. 
Then cache the data with a 
transients cache 
or 
tlc_transient() 
$request = wp_remote_get('http://example.com'); 
$response = wp_remote_retrieve_body( $request ); 
echo $response; 
<?php 
// Define your callback (other examples use 
this) 
function my_callback() { 
return wp_remote_retrieve_body( 
wp_remote_get( 'http://example.com/feed.xml', 
array( 'timeout' => 30 ) ) 
); 
} // Grab that feed echo 
$data = tlc_transient( 'example-feed' ) 
->updates_with( 'my_callback' ) 
->expires_in( 300 ) 
->get(); 
If( false != $data ){ 
// show data 
} 
?> 
https://github.com/markjaquith/WP-TLC-Transients
Questions? 
http://www.slideshare.net/pbearne

Using WordPress as your application stack

  • 1.
    Using WordPress as your application stack WHY AND HOW
  • 2.
    @me Senior FullStack WordPress Developer Plugin author of Author Avatars List http://wordpress.org/plugins/author-avatars/ and WP Site Verification tool http://wordpress.org/plugins/wp-site-verification-tool/ Slides @ http://www.slideshare.net/pbearne
  • 3.
    Why WordPress? •Stable •Supported •Community •Scales
  • 4.
    Why not WordPress? •Code debt •PHP •Has PHP global’s •Not sexy
  • 5.
    23% OF THESITES IN WHOLE INTERNET
  • 6.
  • 7.
  • 8.
    How •Actions andfilters •JSON API •jQuery - Backbone •Template hierarchy •Custom post types
  • 9.
    Filter add_filter(‘fliter_name’, ‘function_to_run’); Function function_to_run( $var ){ $var .= ‘hello world’; return $var; } http://codex.wordpress.org/Plugin_API#Filters
  • 10.
    Action add_action(‘action_name’, ‘function_to_run’); Function function_to_run( $var = null ){ echo ‘hello world’; } http://codex.wordpress.org/Plugin_API#Actions
  • 11.
    Ajax Route /** * Register a rewrite endpoint for the API. */ function prefix_add_api_endpoints() { add_rewrite_tag( '%api_item_id%', '([0-9]+)' ); add_rewrite_rule( 'api/items/([0-9]+)/?', 'index.php?api_item_id=$matches[1]', 'top' ); } add_action( 'init', 'prefix_add_api_endpoints' ); https://10up.github.io/Engineering-Best-Practices/php/#ajax-endpoints
  • 12.
    Ajax handler functionprefix_do_api() { global $wp_query; $item_id = $wp_query->get( 'api_item_id' ); if ( ! empty( $item_id ) ) { $response = array(); // Do stuff with $item_id wp_send_json( $response ); } } add_action( 'template_redirect', 'prefix_do_api' );
  • 13.
    JSON API wordpress.com Part of the Jetpack plug-in http://developer.wordpress.com/docs/api/ https://developer.wordpress.com/docs/api/console/ End point https://public-api.wordpress.com/rest/v1/ e.g. https://public-api. wordpress.com/rest/v1/sites/authoravatars.wordpress.com/
  • 14.
    JSON API wp.org(self host) Part of next version of core (currently plug-in) http://wp-api.org/ End point https://domain.com/wp-json/
  • 15.
    JSON API wp-api.org/v. WP.com WP.com Wp-api.org Caching On you server Little load on your servers Extendable Access to WordPress.com user and stats More complete The API’s don’t match (yet)
  • 16.
    BackBone Included withWordPress  To just load it wp_enqueue_script( ‘backbone’ ); Or better still load as a dependency of your script wp_enqueue_script( ‘myscript’, ‘path/to/script, array( 'backbone' ) ); https://github.com/tlovett1/_s_backbone
  • 17.
    Template Hierarchy Theorder Wordpress load its template files http://codex.wordpress.org/Template_Hierarchy
  • 18.
  • 19.
    Custom post types The main logical data object in WordPress The standard types are : post, page, media add_action( 'init', 'create_post_type' ); function create_post_type() { register_post_type( 'acme_product', array( 'labels' => array( 'name' => __( 'Products' ), 'singular_name' => __( 'Product' ) ), 'public' => true, 'has_archive' => true, ) ); } http://codex.wordpress.org/Post_Types
  • 20.
    Custom metadata Thedata linked to a post object Text or serialized data Use CMB2 to easily create admin forms Hide the metadata from admin by starting the id with an “_” $meta_boxes[ 'tombstone_page_metabox' ] = array( 'id' => __( 'tombstone_page_metabox', Config::get_text_domain() ), 'title' => __( 'Tombstone Details', Config::get_text_domain() ), 'object_types' => array( self::get_tombstone_post_type() ), https://github.com/WebDevStudios/CMB2 // Post types 'context' => 'normal', 'priority' => 'high', 'show_names' => true, // Show field names on the left 'fields' => array( array( 'name' => __( 'Tag line', Config::get_text_domain() ), 'desc' => __( 'Enter the pull Quote', Config::get_text_domain() ), 'id' => Config::_get_prefix() . 'tagline', 'type' => 'textarea_small', 'attributes' => array( 'style' => 'width:100%;', ), ), ) );
  • 21.
    Call external APIand cache Use the internal wp_remote_get() get remote data. Then cache the data with a transients cache or tlc_transient() $request = wp_remote_get('http://example.com'); $response = wp_remote_retrieve_body( $request ); echo $response; <?php // Define your callback (other examples use this) function my_callback() { return wp_remote_retrieve_body( wp_remote_get( 'http://example.com/feed.xml', array( 'timeout' => 30 ) ) ); } // Grab that feed echo $data = tlc_transient( 'example-feed' ) ->updates_with( 'my_callback' ) ->expires_in( 300 ) ->get(); If( false != $data ){ // show data } ?> https://github.com/markjaquith/WP-TLC-Transients
  • 22.