Advanced WordPress Tooling

Modern Toolingwith
WordPress
Keanan Koppenhaver
CTO, Alpha Particle
keanan@alphaparticle.com
AlphaParticle
@kkoppenhaver

@kkoppenhaver
alphaparticle.com/chiphp

AlphaParticle
@kkoppenhaver

AlphaParticle
@kkoppenhaver
The Good Ol’ Days
Shared hosting
FTP Deployments
Clunkycustom field support
Difficultto monitor
Small/Medium Blogs

AlphaParticle
@kkoppenhaver
NewWordPress

How?
AlphaParticle
@kkoppenhaver

AlphaParticle
@kkoppenhaver
Case Studies
Enterprise levelWordPress (Koppenhaver)
Cloud-scale WordPress (AWS)
This talk(You’re in the rightplace)

Thoseare high-level overviews
Let’s getinto specific tools
AlphaParticle
@kkoppenhaver

Localenvironment
(unheard of in good ol’WordPress)
AlphaParticle
@kkoppenhaver

AlphaParticle
@kkoppenhaver
12 FactorAPp
(https://roots.io/twelve-factor-wordpress/)
Configsand .envfiles
Composer for management

File Structure
├── composer.json
├── config
│ ├──application.php
│ └── environments
│ ├── development.php
│ ├── staging.php
│ └── production.php
├──vendor
└──web
├──app
│ ├── mu-plugins
│ ├── plugins
│ ├── themes
│ └── uploads
├──wp-config.php
├── index.php
└──wp
├── index.php
├──wp-config.php
├──wp-load.php
├──wp-login.php
├──wp-includes
│ ├──A bunch ofWP files
├──wp-admin
│ ├──A bunch ofwp files
├──wp-content
│ ├── mu-plugins
│ ├── plugins
│ ├── themes
│ └── uploads

AlphaParticle
@kkoppenhaver
Honorable mentions
VaryingVagrantVagrants (VVV)
Homestead

DevelopmentWorkflow
AlphaParticle
@kkoppenhaver

AlphaParticle
@kkoppenhaver
Better plugin management
WPackagist
Repository forwp plugins thatcan be
pulled in through composer
"require": {
"wpackagist-plugin/akismet":"dev-trunk",
}

Pluginsaren’tjustfor end users
AlphaParticle
@kkoppenhaver

AlphaParticle
@kkoppenhaver
Objects to Objects
(one of those times notto useWordpress)
Butifyou must…
Letsyou relate “objects” to “objects”and
provides queryinterface for these
relations

add_action('init', ‘register_o2o_connection');
/*Assign related galleries toasingle post*/
function register_o2o_connection() {
O2O::Register_Connection('post_galleries', 'post', 'gallery',array(
'reciprocal' => true,
'to' => array(
'sortable' => true,
'labels' =>array(
'name' => 'Galleries',
'singular_name' => 'Gallery'
)
),
'from' =>array(
'labels' =>array(
'name' => 'Posts',
'singular_name' => 'Post'
)
)
));
}

AlphaParticle
@kkoppenhaver
Fieldmanager
Custom fields…defined in code
Helps deployfields throughVCS
instead of relying on the DB

add_action( 'fm_post_post', function() {
$fm = new Fieldmanager_Group( array(
'name' => 'contact_information',
'children' =>array(
'name' => newFieldmanager_Textfield( 'Name' ),
'phone' => newFieldmanager_Textfield( 'Phone Number' ),
'website' => new Fieldmanager_Link( 'Website' ),
),
) );
$fm->add_meta_box( 'ContactInformation', 'post' );
} );

AlphaParticle
@kkoppenhaver
QueryMonitor
Helps you seewhat’sactuallygoing on
Debugs SlowQueries, Load time,
Template loading, hooks, transients,
and more

AlphaParticle
@kkoppenhaver
Rewrite Rules Inspector
Necessarywhen doing custom URL
rewrites
Letsyou putinaURLand see the
rewrites thatmatched
Can flush permalinkfrom inside plugin

Templating
Timber letsyou use twig template
Eliminates alotofWP ugliness
<?php
$thumb_id = get_post_thumbnail_id($post->ID);
$url=wp_get_attachment_url($thumb_id); ?>
<img src="<?php echo $url; ?>"
alt="Thumbnailfor <?php echo $post->post_title; ?>" />
<img src=“{{post.thumbnail.src}}"
alt="Thumbnailfor Timber" />
AlphaParticle
@kkoppenhaver

Wp-cli
Command line interface to interactwith Wordpress
Mostactions thatcan be undertaken with Wordpress
can be done through the command line
Wp core update
wp plugin install
Custom cli commands (migration, scripting, etc)
AlphaParticle
@kkoppenhaver

Functions.php
Splitfunctions.php into multiple parts
template-tags.php, media.php, etc
Betteryet, if functionalitycan be encapsulated,
splititoutinto aplugin
Use namespaces to ensureyour functions don’t
conflict, because everything is global
AlphaParticle
@kkoppenhaver

Frontend
You can use sass,justenqueueyour compiled
css
You can use webpackor gulp or npm or
whatever
Basically, findawayto outputacompiledJS/CSS
fileand you can use it
AlphaParticle
@kkoppenhaver

Frontend (pt2)
You can havean entirelydecoupled front-end
oraSPAtype of site
WP RESTAPI (in core since 4.7)
Caveat:Auth is hard
Caveat2: Plugins
AlphaParticle
@kkoppenhaver

Coding standards
Usefulwhen workingacrossateam
Phpcs andWPCS
WPCSactually includes:Wordpress-core,wordpress-
docs,Wordpress-extra(WPCORE++),Wordpress-vip
Can be hooked up toyour editor to run on save
AlphaParticle
@kkoppenhaver

And finally…
AlphaParticle
@kkoppenhaver

Please useversion control
AlphaParticle
@kkoppenhaver

Version control
Some of the bestpracticeswe have covered
helpwith this
avoid constantfunctions.php merge
conflicts
Don’tversion controluploads…or plugins
(ifyou’re using composer)
AlphaParticle
@kkoppenhaver

Deployment
AlphaParticle
@kkoppenhaver

THe firstrule of deploymentis…
AlphaParticle
@kkoppenhaver

NO FTP
(Mostly)
AlphaParticle
@kkoppenhaver

Deployment
Can useanything thathooks intoVCS
Trellis (uses bedrockand deploys
through Ansible)
Deploys should be the leastpainful
partofyourworkflow
AlphaParticle
@kkoppenhaver

Other considerations
Php7
Gutenberg/react
AlphaParticle
@kkoppenhaver

Questions?
@kkoppenhaver
alphaparticle.com/chiphp

Advanced WordPress Tooling

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to Advanced WordPress Tooling

Similar to Advanced WordPress Tooling (20)

More from Keanan Koppenhaver

More from Keanan Koppenhaver (11)

Recently uploaded

Recently uploaded (20)

Advanced WordPress Tooling