Download - WordPress Development Workflow
![Page 1: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/1.jpg)
![Page 2: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/2.jpg)
Software & services in no particular order…
WAMP, LAMP, LEMP, PHPStorm, Tortoise SVN, Git, GitHub, Bitbucket, Grunt (uglify, imagemin, compass, concat, csslint, phplint, jshint, watch, phpunit), Vagrant, Virtual Box, Sass, FTP, sFTP, WinSCP, SSH, PUTTY, Notepad, FireFox (firebug), Chrome (inspector), IE , Safari, Opera, Browser Stack, Araxis Merge, IceChat, Skype, Composer, ProjectLibre, Basecamp, SlickPlan,PhotoShop, Illustrator, Gmail, Google Drive, Google Apps, Zip, Timedoctor, Winamp
PHEW!
![Page 3: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/3.jpg)
This is what I assume happens*..
Client: Hey – I need a website. You do those things don’t you?
Us: Sure. Whaddaya need it to do?
Client: blah blah blah. big slider. yadda yadda… by Friday
Us: You got any money and content?
Client: Ooddles
Us: Cool. Let’s start. Here, sign this..
*I don’t do the sales side of the business
![Page 4: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/4.jpg)
Step 1: Detailed Requirements Gathering
Features, Environment (old/new) , Content (copy), Timescales, Responsibilities
Step 2: Get Design Prototypes from Graphic Designer
Homepage, RWDs, Style Board, Blog, Custom Templates etc.
Step 3: Review Designs
Against: requirements, UI (usability) & technical Identify: page templates, custom post types, post formats, fonts, custom features, sidebar/widget areas
Feedback to designer and cycle until happy client
![Page 5: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/5.jpg)
We use SlickPlan for site content structure
Give clients access – they create structure
Involves clients directly – they start thinking about content
Export as XML
WordPress plugin for imports – creates pages
slickplan.com
![Page 6: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/6.jpg)
We use BaseCamp as primary communications and content collection tool.
Projects, files, tasks, to-dos & dates.
Keeps everything in one easy-to-access place
Alternative: TeamWork www.teamwork.com
basecamp.com
![Page 7: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/7.jpg)
What volume of traffic will the site get?
<500 uniques per day (upd) = shared hosting + LAMP
500 - 1500 upd = VPS, 2 core, 2GB + LAMP
>1500 upd = VPS 2-4 core, 4-6GB, SDD + LEMP (Nginx “Engine X”)
>10,000 upd = Bespoke VPS (Bulletproof, Rackspace, Amazon, Google AppEngine) – something that scales
![Page 8: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/8.jpg)
Russian Web Server
Russians build stuff that work well and last long
Mir, Soyuz, T34, Mig, AK47, Nginx
Apache = Process Driven
= multiple threads = fast for small #’s of requests
Nginx = event driven
= highly scalable, single master process, multiple (scalable) worker threads
![Page 9: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/9.jpg)
What type of project am I setting up?
Regular = Genesis
eCommerce = WooCommerce
Directory Listing = AppThemes
Other = bespoke theme?
We maintain standard builds of Genesis, WooCommerce & ClassiPress (AppThemes)
![Page 10: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/10.jpg)
Maintained on our dev servers
Current Version of WordPress
Required parent theme (Genesis, WooCommerce, etc.)
A blank child theme
All of our plugins
All of our branding
All of our users & settings
Debugging on – logging to file
![Page 11: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/11.jpg)
Genesis framework parent theme (duh)
Blank child theme
Advanced Custom Fields
CPT-onomies
Gravity Forms
Genesis Visual Hook Guide
![Page 12: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/12.jpg)
WooCommerce parent theme (duh)
Blank child theme
Advanced Custom Fields
CPT-onomies
Gravity Forms
WooSidebars
WP All Import with WooCommerce Add-On
![Page 13: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/13.jpg)
• Advanced Automatic Updates
• ManageWP
• Debug Bar
• Revision Control
• Revolution Slider
• SlickPlan
• Stop Media Comment Spamming
• Video User Manuals
• WordFence Security
• WordPress SEO
• WP Migrate DB
• WP Minify
• WP Super Cache
• XCloner / VaultPress
![Page 14: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/14.jpg)
We use a Must-Use plugin to brand our sites.
Can’t be uninstalled! (easily)
![Page 15: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/15.jpg)
We have a support plugin linked to ZenDesk.
PayPal & Sliver Stripe
Subscription API
ZenDesk API
RESTful JSON API
![Page 16: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/16.jpg)
Git = distributed
You have a full copy of the repo on local machine
You can add/commit/push to your local repo
You can develop with no internet connection
SVN = centralised
You can only add/commit/push to repo on server
You need an internet connection
![Page 17: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/17.jpg)
Uber Quick Intro to Git
![Page 18: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/18.jpg)
Git + Bitbucket = private repo
Git + GitHub = public repos
1. Create new repo on local or server
2. Add local/server as remote repo
3. Add, Commit and Push to master branch
4. Code is now under Git version control
![Page 19: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/19.jpg)
Pull = pulls files down from Git repository (repo)
Add = adds a local file to repo (version control)
Commit = commits file changes to local repo (marked as changed with description)
Push = pushes committed files up to remote Git repo
![Page 20: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/20.jpg)
Git allows you to clone a repository.
Once cloned you can pull down the entire repo from master branch.
Push and Pull changes – Git takes care of everything else
![Page 21: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/21.jpg)
New repos have a “Master” branch
You can create a new branch from master.
e.g. Wil Work on this branch separately from master
Add/test new functionality
Delete if not required – doesn’t affect master!
If OK – merge your branch into master
Your new functionality is now available to everyone
![Page 22: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/22.jpg)
![Page 23: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/23.jpg)
.gitignore file allows you to specify local files you don’t want Git to version control
e.g. # Ignore local wp-config.php & .htaccess
/wp-config.php
/.htaccess
# Ignore PhpStorm config files
/.idea
![Page 24: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/24.jpg)
Local Machine Staging Server Production Server
Branch – “Wil” “Master” “Live”
Git Repo
PUSH / PULL PULL PULL
Standard Build
![Page 25: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/25.jpg)
1. New site from Standard Build on staging server
2. Add, Commit & Push to create new Git repo
3. Clone to local
4. Create branch “Wil”
5. Time taken ~5 mins (10 mins with a tea break)
![Page 26: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/26.jpg)
WordPress Core?
What about automatic updates and plugin updates?
Easy Way
include entire site in Git & use .gitignore to exclude WordPress core & plugins
Better Way
Include WordPress as a Git submodule /wp
Move wp-content folder to Git root
![Page 27: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/27.jpg)
We’ll Cover Git In More Depth Another Day!
![Page 28: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/28.jpg)
Object Oriented Programming – yes!
Vast majority of WordPress Core is not OOP
Doesn’t mean that you have to do the same
Our plugins are OO
Our functions.php includes OO class files
Easier to build, easier to test & easier to reuse.
![Page 29: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/29.jpg)
Realtime error checking
Full Git support
PhpDoc support
PhpUnit support
Code completion (not for WordPress yet)
Php refactoring
www.jetbrains.com/phpstorm
![Page 30: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/30.jpg)
Create standard virtual environments
Everyone developing in same environment
Less chance of issues when deploying to production
www.vagrantup.com
![Page 31: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/31.jpg)
JavaScript Task Runner
Automates boring but necessary tasks
Image compression
JSHint
Sass compiling
Minification & concatination
www.gruntjs.com
![Page 32: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/32.jpg)
Why bother testing at all?
Ensures code reliability
Avoids nasty whoopies & client upsets
Assures your commitment to professionalism
Puts in checks when working with contractors / distributed workers
www.phpunit.de
![Page 33: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/33.jpg)
Package dependency manager for Php
Does your project depend on a number of libraries?
Do those libraries depend on other libraries?
Composer deals with external libraries and versions so you don’t have to do it manually
www.getcomposer.org
![Page 34: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/34.jpg)
1. Out-of-hours deployment
2. Pull “Live” Git branch to production server
3. Production Site QA – 82 step internal guide
4. Add clients to MailChimp support lists
• System issues, updates, information
• Auto responders +1, +3, +6, +12 months
5. Set up clients with ZenDesk for support
![Page 35: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/35.jpg)
• [1] anglonautes.com
• [5] slickplan.com
• [6] 37signals.com
• [11] studiopress.com
• [12] woothemes.com
• [22] betterexplained.com
• [29] jetbrains.com
• [30] vagrantup.com
• [31] gruntjs.com
• [33] getcomposer.com
![Page 36: WordPress Development Workflow](https://reader034.vdocuments.site/reader034/viewer/2022052315/54ba35344a7959f81d8b4584/html5/thumbnails/36.jpg)