How To Show Your WordPress Work To Clients

Presenting work-in-progress to serviced clients can be a challenge. Same goes for the “go-live” activity, which often includes publishing or updating a site.

It is easy to use FTP to copy website files. That approach, however, comes with risks and drawbacks. Moreover “what happens if we want to allow "client reviews" while work is still on-going?”

That is where a deployment workflow can help.

This talk shared experiences and lessons learned from developing a simple, stable, and consistent deployment workflow for serviced clients.

The talk suggested practices and policies that may be adopted or modified to suit each individual shop. It also examined potential challenges and risks that affect deployment activities. It then made recommendations to reduce their impact.

Attendees gained insight to an active deployment workflow, which can be used to demonstrate on-going work to serviced clients. They also discovered a set of tools, practices, and policies, which they can apply on their own client projects.

Transcript

1. How To Show Your Work to Clients Deployment Practices and Workflow
2. A Tale of Two Deployments How this talk came about • Early deployments using FTP • Compatibility problems • Fast Forward
3. Introductions CJ Andrew Consultant/Contractor WooCommerce Storefronts • This is not business advice • This is not developer advice • Your mileage will vary
4. The Conversation • • Do Clients need to see Work In Progress? • • See – Do – Be (The 3 Amigos) • • Practices & Policies • • A reference architecture • • Topical scenarios and a Case Study in practice
5. WHY Business Case for showing Work In Progress to clients • Reduces tension in small projects • Empowers the project owner • Allows the builder to test alternate scenarios safely • Demonstrates value to the client • Facilitates change management • Protects intellectual property • Evidence of work
6. WHAT End result of hard work • Visual communication • Transactional vehicle • Interpretation of business rules
7. WHAT 3 Components (the 3 amigos) • Assets • Code • Content
8. How • Implemented by practices • Guided by policies • Supported by infrastructure • Enhanced by tools
9. How • Practices • Environments as Views • Development environment: SANDBOX • Integration environment: QA • Production environment: LIVE • Deployments as Releases • Stabilise in a sandbox • Show completed work-cycle
10. How • Policies • Governance over the 3 components • Defines areas of concerns • Encourages transparency • Defined per shop/per project • Specific to the view in question
11. How • Infrastructure • Multi-tenant servers • Local servers with port routing [ngrok] • Pipeline-oriented hosting (GoDaddy Managed WordPress, Siteground)
12. How • Tools • Git • Gulp • WP-CFM • Migrate DB Pro • GitLab
13. Using • Conceptual Map • Reference Architecture • Workflow
14. Using Conceptual Map • • • • • • • • •
15. Using Reference Architecture
16. Using Automation Architecture
17. Using Workflow 0 1 2 3 4 5 6 7 Job Init Sandbox Develop Stabilise Build Integration [pull] [acceptance] QA SignOff [billing] Job Terminate
18. IIF • A simple realisation of the concept • A managed approach • Typical scenario
19. IIF Simple realisation of the approach Local Staging Live • Concepts • Practices • Policies Staging and Live: WPEngine
20. IIF A managed approach Dev Test Live Dev, Test, and Live: Pantheon Infrastructure Local [git,gulp,wp-cfm,migratedb-pro]
21. IIF Typical scenario - Car widget storefront Complex Business Rules • Shipping • Stock Management • Checkout Code Existing User Interface • Conversion Optimised • Audience Oriented Assets Existing Storefront • Migrate to WooCommerce Content Transactions
22. LDE Scenario Architecture Pantheon Infrastructure 2 CI LDE 1 DEV 3 TEST 4 LIVE 5 Inject One Way Subscribe QA+Signoff Stabilise Pull
23. Challenges • Introduces complexity • Less flexible • Requires additional knowledge of platforms • Some client education required Overcome by repetition and persistence
24. References • Git: https://git-scm.com/ • Gulp: https://gulpjs.com/ • Grunt: https://gruntjs.com/ • GitLab: https://about.gitlab.com/ • WP-CFM: https://en-gb.wordpress.org/plugins/wp-cfm/ • WP MigrateDB Pro: https://deliciousbrains.com/wp-migrate-db-pro/ • Pantheon: https://pantheon.io/ • Article: https://pantheon.io/docs/wp-cfm/ • Software Engineering – Ian Sommerville