Like many others, WordPress has been my personal blogging tool for a long time. A powerful tool for easy publishing! That is what everyone wants. Large sites like TechCrunch and TheNextWeb use it exactly for that reason. And more enterprises seem to discover it as good solution to their too-expensive publication tools. But keeping those WordPress instances running requires skills and knowledge. Because of WordPress extendibility and its very active community, you can do this too. This tutorial will teach you how use Ansible, Composer, WP-CLI, WP REST API, and Elasticsearch can push WordPress from a personal blogging tool into an enterprise-worthy level application. Out with FTP based SCM ... in with automated deployment, dependency management, and utterly fast search.

1. THE ENTERPRISE WOR/D/THY/PRESS

2. THE FAMOUS 5-MINUTE INSTALLATION
WORDPRESS

3. BUT WHAT ABOUT MAINTENANCE?
WORDPRESS

4. IS THE ADMIN THE BEST PLACE?
MANAGE THEMES & PLUGIN VERSIONS?
WORDPRESS

5. CHANGES OR NEW FUNCTIONALITY
HOW DO YOU TEST OR DEVELOP?
WORDPRESS

6. WITH MINIMAL DOWNTIME
AND WHAT ABOUT DEPLOYING?
WORDPRESS

7. FOR THE BEST USER EXPERIENCE
IT NEEDS TO BE FAST!
WORDPRESS

8. DEVOPS CLI FRONTEND SEARCH

9. DEVOPS CLI FRONTEND SEARCH

10. WE NEED FULL CONTROL OF DEV & OPS

11. TO DEPLOY TO MULTIPLE ENVIRONMENTS
DEPENDENCY MANAGEMENT

12. FOR CONSISTENT ENVIRONMENTS
AUTOMATION

13. DEV DEPENDENCY
MANAGEMENT

14. GETCOMPOSER.ORG
COMPOSER
DEPENDENCY MANAGEMENT

15. PHP PACKAGE REPOSITORY
PACKAGIST.ORG
DEPENDENCY MANAGEMENT

16. CUSTOM PATHS DEFINITIONS
COMPOSER INSTALLERS
DEPENDENCY MANAGEMENT

17. COMPOSER’ED’ PLUGIN & THEME MIRROR OF WORDPRESS.ORG
WPACKAGIST.ORG
DEPENDENCY MANAGEMENT

18. NOT SUPPORTED IN WORDPRESS CORE :(
COMPOSER
DEPENDENCY MANAGEMENT

19. GITHUB.COM/JOHNPBLOCH/WORDPRESS
BUT THERE IS A SOLUTION
DEPENDENCY MANAGEMENT

20. DEPENDENCY MANAGEMENT
{
"name": "epwp/wordpress",
"type": "project",
"require": {
"php": ">=7.0",
"johnpbloch/wordpress": "4.6.1"
},
"extra": {
"wordpress-install-dir": "custom/path"
}
}

21. 1 . 2 . 3
MAJOR . MINOR . PATCH
BC-BREAKS . FEATURES . FIXES
SEMVER
DEPENDENCY MANAGEMENT

22. ~ 1 . 2 . 3
^ 1 . 2 . 3
VERSIONING
DEPENDENCY MANAGEMENT

23. ROOTS.IO/BEDROCK
BEDROCK
BEDROCK

24. BEDROCK
├── 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

25. NEVER HARDCODE OR STORE VARIABLES
WP-CONFIG CHANGES
BEDROCK

26. BEDROCK
/**
* Use Dotenv to set required environment variables
* and load .env file in root
*/
$dotenv = new DotenvDotenv($root_dir);
if (file_exists($root_dir . '/.env')) {
$dotenv->load();
$dotenv->required(
[
'DB_NAME', 'DB_USER', 'DB_PASSWORD',
'WP_HOME', 'WP_SITEURL'
]
);
}

27. OPS AUTOMATION

28. PROVISIONING, CONFIGURATION & DEPLOYMENT
ANSIBLE
AUTOMATION

29. IN YAML FORM
PLAYBOOKS
AUTOMATION

30. AUTOMATION
---
- hosts: webservers
vars:
http_port: 80
max_clients: 200
remote_user: root
tasks:
- name: ensure apache is at the latest version
yum: name=httpd state=latest
- name: write the apache config file
template: src=/srv/httpd.j2 dest=/etc/httpd.conf
notify:
- restart apache
- name: ensure apache is running (and enable it at boot)
service: name=httpd state=started enabled=yes
handlers:
- name: restart apache
service: name=httpd state=restarted

31. DOCS.ANSIBLE.COM/ANSIBLE/
MODULES
AUTOMATION

32. COMMUNITY ROLE MANAGER
ANSIBLE GALAXY
AUTOMATION

33. AUTOMATION
- name: composer
src: geerlingguy.composer
version: 1.2.7
- name: ntp
src: resmo.ntp
version: 0.3.0
- name: logrotate
src: nickhammond.logrotate
version: fc3ea4

34. FOR SENSITIVE DATA ENCRYPTION
ANSIBLE VAULT
AUTOMATION

35. AUTOMATION
vi file_with_passwords.yml
==
ansible-vault edit file_with_password.yml

36. .VAULT_PASS NOT UNDER VERSION CONTROL
KEEP YOUR KEY PRIVATE
AUTOMATION

37. ANSIBLE-PLAYBOOK DEPLOY.YML -E ENV=<ENV> -E SITE=<SITE>
DEPLOY WITH CONFIDENCE
AUTOMATION

38. ROOTS.IO/TRELLIS
TRELLIS
TRELLIS

39. FOR LOCAL DEVELOPMENT
VAGRANT
AUTOMATION

40. § Nginx
§ MariaDB
§ PHP 7.0
§ Composer
§ WP-CLI
§ LetsEncrypt SSL
§ Page caching like Varnish
§ Data caching in memory
§ Ops best practices
TRELLIS

41. TRELLIS
epwp.com/ # → Root folder for the project
├── trellis/ # → Automation, provision, deployment
└── site/ # → A Bedrock-based WordPress site
└── web/
├── app/ # → WordPress content directory
└── wp/ # → WordPress core (don't touch!)

42. DIY LET’S BOOTSTRAP THIS!

43. TRELLIS
mkdir epwp.com
cd epwp.com
git clone https://github.com/jvandijk/epwp-trellis.git trellis
git clone https://github.com/jvandijk/epwp-site.git site

44. DEVOPS CLI FRONTEND SEARCH

45. FASTER ADMINISTRATION OF WORDPRESS
WP CLI
WP-CLI

46. WP-CLI
vagrant@epwp:/srv/www/epwp.com/current$ wp cli info
PHP binary: /usr/bin/php7.0
PHP version: 7.0.11-2+deb.sury.org~xenial+2
php.ini used: /etc/php/7.0/cli/php.ini
WP-CLI root dir: phar://wp-cli.phar
WP-CLI packages dir: /home/vagrant/.wp-cli/packages/
WP-CLI global config:
WP-CLI project config: /srv/www/epwp.com/current/wp-cli.yml
WP-CLI version: 0.24.1

47. TO EXECUTE DIRECT DATABASE QUERIES
WP DB
WP-CLI

48. MIGRATE YOUR DATA
WP EXPORT & IMPORT
WP-CLI

49. MODIFY CONTENT
WP SEARCH-REPLACE
WP-CLI

50. INSTALL, CHECK-UPDATE, MULTISITE CHANGE
WP CORE

51. INSTALL, CHECK-UPDATE, MULTISITE CHANGE
WP CORE

52. `WP PACKAGE BROWSE` FOR MORE OSS CLI EXTENSIONS
WP CLI PACKAGES
WP-CLI

53. GENERATE CODE ACCORDING TO BEST PRACTICES
WP SCAFFOLD
SCAFFOLDING

54. GENERATE CODE FOR PLUGIN
WP SCAFFOLD PLUGIN <SLUG>
SCAFFOLDING

55. GENERATE CODE FOR A CUSTOM POST TYPE
WP SCAFFOLD POST-TYPE <SLUG>
SCAFFOLDING

56. GENERATE THE CODE FOR A TAXONOMY
WP SCAFFOLD TAXONOMY <SLUG> —POST-TYPES=<A,B>
SCAFFOLDING

57. IMPLEMENT PLUGIN
<?php
/*
Plugin Name: My WP extension
Plugin URI: https://www.a-wp-site.com/
Description: WordPress extension
Version: 1.0.0
Author: Enrise
Author URI: https://www.enrise.com
*/
require_once('src/Bootstrap.php');
new Bootstrap::getInstance();

58. IMPLEMENT PLUGIN
public static function getInstance() {
if ( ! ( self::$instance instanceof self ) ) {
self::$instance = new self();
}
return self::$instance;
}
protected function __construct() {
add_action( 'plugins_loaded', [ $this, 'doYourThing' ], 100 );
}
public function doYourThing() {
// trigger your scaffolded code from here
return;
}

59. LIST, SEARCH, INSTALL, ACTIVATE, UPDATE
WP PLUGIN
3RD PARTY PLUGIN

60. LIST, SEARCH, INSTALL, ACTIVATE, UPDATE
WP PLUGIN
3RD PARTY PLUGIN

61. TO LOCK ON A VERSION
COMPOSER REQUIRE WPACKAGIST-PLUGIN/SLUG
3RD PARTY PLUGIN

62. ADVANCEDCUSTOMFIELDS.COM
LET’S EXTEND THAT CUSTOM POST TYPE
CUSTOM FIELDS

63. COMPOSER REQUIRE WPACKAGIST-PLUGIN/ADVANCED-CUSTOM-FIELDS
ADVANCED CUSTOM FIELDS
CUSTOM FIELDS

64. WILL BE STORED IN DATABASE
DESIGN CUSTOM FIELD ADDITIONS IN THE ADMIN
CUSTOM FIELDS

65. UNFORTUNATELY NO DIRECT SCAFFOLDING
EXPORT CUSTOM FIELDS TO PHP
CUSTOM FIELDS

66. DEVOPS CLI FRONTEND SEARCH

67. DECOUPLED CMS
GOING HEADLESS

68. NO MONOLITH STRATEGY
SCALING UP

69. TRANSPILE TO SUPPORT OLDER TECHNOLOGIES
BLEEDING EDGE JAVASCRIPT & CSS

70. START USING IT TODAY!
ECMASCRIPT 2016

71. NPM INSTALL ESLINT —SAVE-DEV
ESLINT

72. NPM INSTALL ESLINT-CONFIG-AIRBNB —SAVE-DEV
ESLINT-CONFIG-AIRBNB

73. .ESLINTRC
{
"root": true,
"extends": "airbnb",
"globals": {
"wp": true
},
"parser": "babel-eslint",
"rules": {
"react/jsx-filename-extension":
[
1, { "extensions": [".js", ".jsx"] }
],
}
}

74. TRANSPILE DOWN TO ECMASCRIPT 5
BABEL JS

75. MODULE BUNDLER
WEBPACK

76. COMPONENT BASED STRATEGY
src/components/blocks/Logo/
├── Logo.css
├── Logo.js
├── package.json
└── logo.svg

77. EXTRACT-TEXT, FILE-LOADER, URL-LOADER
WEBPACK PLUGINS

78. AUTO RELOAD ON EVERY CODE CHANGE
WEBPACK HOT MIDDLEWARE

79. DESIGN IN MULTIPLE BROWSERS SIMULTANEOUS
BROWSER SYNC

80. DEVELOPER EXPERIENCE

81. COMPLETE DECOUPLE THE FRONTEND
WORDPRESS REST API

82. COMPOSER REQUIRE WP-API/WP-API
WORDPRESS REST API

83. USE THE POWER OF AMAZON S3
MEDIA STORAGE

84. COMPOSER REQUIRE HUMANMADE/S3-UPLOADS
MEDIA STORAGE

85. ARE YOU READY?
NOW LET’S START SETTING UP

86. SERIOUSLY?

87. LET’S NOT REINVENT THE WHEEL..
SERIOUSLY?

88. ROOTS.IO/SAGE
SAGE

89. § Sass for stylesheets
§ ES6 for JavaScript
§ Webpack for compiling assets, optimizing images, and
concatenating and minifying files
§ BrowserSync for synchronized browser testing
§ Bootstrap 4 for a front-end framework
§ Template inheritance
SAGE

90. TEMPLATE STRUCTURE
$ tree templates
templates
├── 404.php
├── index.php
├── layouts
│ └── base.php
├── page.php
├── partials
│ ├── content-page.php
│ ├── content-single.php
│ ├── content.php
│ ├── entry-meta.php
│ ├── footer.php
│ ├── head.php
│ ├── header.php
│ ├── page-header.php
│ └── sidebar.php
├── single.php
└── template-custom.php

91. composer create-project roots/sage your-theme-name 9.0.0-alpha.3

92. DEVOPS CLI FRONTEND SEARCH

93. WE NEED SOME DATA!
SMALL INTERMEZZO
FAKE DATA

94. GITHUB.COM/FZANINOTTO/FAKER
FAKER
FAKE DATA

95. EXPRESSIVE FIXTURES GENERATOR
ALICE
FAKE DATA

96. WP PACKAGE INSTALL TRENDWERK/FAKER
WP CLI FAKER
FAKE DATA

97. FAKE DATA
TrendwerkFakerPost:
session{41..80}:
post_content: <realText(600, 4)>
post_title: '<sentence()>'
post_type: 'session'
post_date_gmt: <(gmdate('Y-m-d H:i:s', (time() - (rand(1, 5) * 86400) + (
rand(1, 8) * 3600))))>
meta:
date: <(gmdate('Ymd', strtotime(@self->post_date_gmt)))>
start_time: <(strtotime(@self->post_date_gmt) - (strtotime(@self->
post_date_gmt) % 3600))>
# end the session an hour later
end_time: <(3600 + strtotime(@self->post_date_gmt) - (strtotime(@self->
post_date_gmt) % 3600))>
speakers: <(array((string)((int)$this->valueForCurrent - 40 + 10)))>
terms:
location: <terms('location', 1)>

98. WP FAKER FAKE YOUR-FILE.YML
GENERATE THE DATA
FAKE DATA

99. DISTRIBUTED FULL TEXT SEARCH ENGINE
ELASTICSEARCH
SEARCH

100. CONSISTENCY - AVAILABILITY - PARTITION TOLERANCE
NOSQL DATABASE
SEARCH

101. HTTP JSON API
RESTFUL INTERFACE
SEARCH

102. SEARCH
RDBMS ELASTICSEARCH
DATABASE INDEX
TABLE TYPE
ROW DOCUMENT

103. DEFINING YOUR STRUCTURE
MAPPING
SEARCH

104. "your-index" : {
"mappings" : {
"post" : {
"properties" : {
"post_content" : { "type" : "string" },
"post_date" : {
"type" : "date",
"format" : "YYYY-MM-dd HH:mm:ss",
"include_in_all" : false
},
"post_title" : {
"type" : "string",
"store" : true,
"fields" : {
"raw" : {
"type" : "string",
"index" : "not_analyzed"
},
"sortable" : {
"type" : "string",
"analyzer" : "ewp_lowercase"
}
},
...

105. ANALYZED VS NOT ANALYZED
SEARCH

106. COMPOSER REQUIRE WPACKAGIST-PLUGIN/ELASTICPRESS
ELASTICPRESS
SEARCH

107. SEARCH
define('EP_HOST', env('EP_HOST'));
define('ES_SHIELD', env('ES_SHIELD'));
wp elasticpress index --setup

108. SEAMLESS FOR WORDPRESS SEARCH
INTEGRATES WITH WP_QUERY
SEARCH

109. SEARCH
new WP_Query( [
'ep_integrate' => true,
'post_type' => 'post',
'posts_per_page' => 20,
] );

110. ./DEPLOY.SH PRODUCTION EPWP.COM
RUNNING IN PRODUCTION
DEPLOY

111. § initialize - creates the site directory structure
§ update - clones the Git repo onto the remote server
§ prepare - prepares the files in the new release path
§ build - builds the new release
§ share - symlinks shared folders to new release
§ finalize - finalizes the deploy by updating the symlink
ADD YOUR DEPLOY HOOKS IN DEPLOY.YML

112. DEVOPS CLI FRONTEND SEARCH