Recomendados
Más contenido relacionado
La actualidad más candente
La actualidad más candente (20)
Similar a Manage WordPress with Composer, Bedrock, Trellis and DevOps best practices
Similar a Manage WordPress with Composer, Bedrock, Trellis and DevOps best practices (20)
Más de Jeroen van Dijk
Más de Jeroen van Dijk (13)
Último
Último (20)
Manage WordPress with Composer, Bedrock, Trellis and DevOps best practices
- 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
- 10. WE NEED FULL CONTROL OF DEV & OPS
- 11. TO DEPLOY TO MULTIPLE ENVIRONMENTS 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
- 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
- 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
- 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
- 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. EXERCISE gist.github.com/jvandijk/ mkdir epwp.com cd epwp.com git clone https://github.com/jvandijk/epwp-trellis.git trellis cd trellis && git fetch origin git checkout step-1-tutorial-init git clone https://github.com/jvandijk/epwp-site.git site cd site && git fetch origin git checkout step-1-tutorial-init vagrant destroy if you prepared the tutorial
- 44. EXERCISE edit group_vars/development/wordpress_sites.yml - change example domain into ‘epwp.com’ - introduce the WP admin_user ‘epwp_user’ - change the admin email to ‘me@epwp.com' - enable self-signed SSL edit group_vars/development/vault.yml - make the WP admin pass ‘epwp_pass’ - change the database password to ‘dbpassword_development’ OPTIONALLY: - create vault/.vault_pass with a ‘<unique key>’ inside - encrypt with ansible-vault group_vars/development/vault.yml
- 45. IF IT DIDN’T WORK OUT FOR YOU cd trellis git reset --hard git checkout step-3-enable-ssl vagrant destroy & vagrant up
- 47. FASTER ADMINISTRATION OF WORDPRESS WP CLI WP-CLI
- 48. 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
- 49. TO EXECUTE DIRECT DATABASE QUERIES WP DB WP-CLI
- 50. MIGRATE YOUR DATA WP EXPORT & IMPORT WP-CLI
- 52. INSTALL, CHECK-UPDATE, MULTISITE CHANGE WP CORE
- 53. INSTALL, CHECK-UPDATE, MULTISITE CHANGE WP CORE
- 54. `WP PACKAGE BROWSE` FOR MORE OSS CLI EXTENSIONS WP CLI PACKAGES WP-CLI
- 55. SEARCH, LIST, INSTALL, UPDATE, ACTIVATE THEMES WP THEME SCAFFOLDING
- 56. GENERATE CODE ACCORDING TO BEST PRACTICES WP SCAFFOLD SCAFFOLDING
- 57. GENERATE CODE FOR PLUGIN WP SCAFFOLD PLUGIN <SLUG> SCAFFOLDING
- 58. GENERATE CODE FOR A CUSTOM POST TYPE WP SCAFFOLD POST-TYPE <SLUG> SCAFFOLDING
- 59. GENERATE THE CODE FOR A TAXONOMY WP SCAFFOLD TAXONOMY <SLUG> —POST-TYPES=<A,B> SCAFFOLDING
- 60. 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();
- 61. 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; }
- 62. LIST, SEARCH, INSTALL, ACTIVATE, UPDATE WP PLUGIN 3RD PARTY PLUGIN
- 63. LIST, SEARCH, INSTALL, ACTIVATE, UPDATE WP PLUGIN 3RD PARTY PLUGIN
- 64. TO LOCK ON A VERSION COMPOSER REQUIRE WPACKAGIST-PLUGIN/SLUG 3RD PARTY PLUGIN
- 65. ADVANCEDCUSTOMFIELDS.COM LET’S EXTEND THAT CUSTOM POST TYPE CUSTOM FIELDS
- 66. COMPOSER REQUIRE WPACKAGIST-PLUGIN/ADVANCED-CUSTOM-FIELDS ADVANCED CUSTOM FIELDS CUSTOM FIELDS
- 67. WILL BE STORED IN DATABASE DESIGN CUSTOM FIELD ADDITIONS IN THE ADMIN CUSTOM FIELDS
- 68. UNFORTUNATELY NO DIRECT SCAFFOLDING EXPORT CUSTOM FIELDS TO PHP CUSTOM FIELDS
- 69. DIY LET’S CREATE A CONFERENCE SITE
- 70. EXERCISE cd site git checkout step-2-build-the-theme go to /srv/www/epwp.com/current wp theme activate epwp wp plugin activate —all Check: - https://epwp.com/speaker - https://epwp.com/session
- 71. EXERCISE Scaffold a new plugin named ‘epwp’ Activate the plugin Scaffold and add post type ‘session’ Scaffold and add post type ‘speaker’ Scaffold and add taxonomy ‘location’ linked to ‘session’ Check again: - https://epwp.com/speaker - https://epwp.com/session
- 72. Install wpackagist-plugin/advanced-custom-fields Install wpackagist-plugin/acf-field-date-time-picker In admin create & export fields for ‘speaker’ and ‘session’ TEXT DATE_TIME_PICKER DATE_PICKER RELATIONSHIP
- 73. IF IT DIDN’T WORK OUT FOR YOU cd site git reset --hard git checkout step-6-update-admin-fields
- 75. WE NEED SOME DATA! SMALL INTERMEZZO FAKE DATA
- 78. WP PACKAGE INSTALL TRENDWERK/FAKER WP CLI FAKER FAKE DATA
- 79. 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)>
- 80. WP FAKER FAKE YOUR-FILE.YML GENERATE THE DATA FAKE DATA
- 81. DISTRIBUTED FULL TEXT SEARCH ENGINE ELASTICSEARCH SEARCH
- 82. CONSISTENCY - AVAILABILITY - PARTITION TOLERANCE NOSQL DATABASE SEARCH
- 83. HTTP JSON API RESTFUL INTERFACE SEARCH
- 84. SEARCH RDBMS ELASTICSEARCH DATABASE INDEX TABLE TYPE ROW DOCUMENT
- 86. "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" } }, ...
- 87. ANALYZED VS NOT ANALYZED SEARCH
- 89. SEARCH define('EP_HOST', env('EP_HOST')); define('ES_SHIELD', env('ES_SHIELD')); wp elasticpress index --setup
- 90. SEAMLESS FOR WORDPRESS SEARCH INTEGRATES WITH WP_QUERY SEARCH
- 91. SEARCH new WP_Query( [ 'ep_integrate' => true, 'post_type' => 'post', 'posts_per_page' => 20, ] );
- 92. DIY LET’S ENHANCE THE SEARCH
- 93. EXERCISE cd site git checkout step-7-add-fake-data define some session locations in the wp admin go to /srv/www/epwp.com/current wp package install trendwerk/faker wp db query "show create table wp_posts" edit the post ID wp faker fake faker.yml Check: - https://epwp.com/speaker - https://epwp.com/session
- 94. EXERCISE cd site git checkout step-7-add-fake-data Install wpackagist-plugin/elasticpress Create a define ES_SHIELD (user:pass) Create a define EP_HOST (your-domain.com) go to /srv/www/epwp.com/current enable the plugin wp elasticpress index --setup Search for a ‘location’ or just make a typo
- 95. IF IT DIDN’T WORK OUT FOR YOU cd site git reset --hard git checkout step-8-add-elasticsearch-support cd trellis git checkout step-5-add-elasticsearch-support
- 98. NO MONOLITH STRATEGY SCALING UP
- 99. TRANSPILE TO SUPPORT OLDER TECHNOLOGIES BLEEDING EDGE JAVASCRIPT & CSS
- 100. START USING IT TODAY! ECMASCRIPT 2016
- 101. NPM INSTALL ESLINT —SAVE-DEV ESLINT
- 102. NPM INSTALL ESLINT-CONFIG-AIRBNB —SAVE-DEV ESLINT-CONFIG-AIRBNB
- 103. .ESLINTRC { "root": true, "extends": "airbnb", "globals": { "wp": true }, "parser": "babel-eslint", "rules": { "react/jsx-filename-extension": [ 1, { "extensions": [".js", ".jsx"] } ], } }
- 104. TRANSPILE DOWN TO ECMASCRIPT 5 BABEL JS
- 106. COMPONENT BASED STRATEGY src/components/blocks/Logo/ ├── Logo.css ├── Logo.js ├── package.json └── logo.svg
- 107. EXTRACT-TEXT, FILE-LOADER, URL-LOADER WEBPACK PLUGINS
- 108. AUTO RELOAD ON EVERY CODE CHANGE WEBPACK HOT MIDDLEWARE
- 109. DESIGN IN MULTIPLE BROWSERS SIMULTANEOUS BROWSER SYNC
- 110. DEVELOPER EXPERIENCE
- 111. COMPLETE DECOUPLE THE FRONTEND WORDPRESS REST API
- 112. COMPOSER REQUIRE WP-API/WP-API WORDPRESS REST API
- 113. ARE YOU READY? NOW LET’S START SETTING UP
- 114. SERIOUSLY?
- 115. LET’S NOT REINVENT THE WHEEL.. SERIOUSLY?
- 116. ROOTS.IO/SAGE SAGE
- 117. § 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
- 118. 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
- 119. composer create-project roots/sage your-theme-name 9.0.0-alpha.3
- 120. ./DEPLOY.SH PRODUCTION EPWP.COM RUNNING IN PRODUCTION DEPLOY
- 121. § 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
- 123. 20162016