wordpress coding standards & best practices

Coding Best PracticesTips & Tricks for Writing Clean Code in WordPress

WordCamp Winnipeg October 22, 2016 @ Red River College

Blog - shawnhooper.ca Twitter - @shawnhooper

Director of IT at Actionable.

Happy to be visiting here from Ottawa.

Have used WordPress since 2009 as a blogger, freelance developer, and in a corporate environment.

shawnhooper.ca

Hi, I’m Shawn!

Clean, Standard, Testable Code

Why Do We Write Clean Code?

• It’s easier to read • It reduces bugs • It requires less documentation • It reduces technical debt • Be nice to your teammates (code with empathy!)

Why Do We Write Clean Code?

Always code as if the guy who ends up maintaining your code will be a violent psychopath who knows where you live.

- John Woods

Accessibility, PHP, JavaScript, HTML & CSS

WordPress Coding Standard

https://make.wordpress.org/core/handbook/best-practices/coding-standards/

All new or updated code released in WordPress must conform with the WCAG 2.0 guidelines at

level AA.

Accessibility

• Proper Heading Structure • Semantic Markup • wp.a11y.speak() • Images & Icons. ALT for Images, <title> in SVG. • Labels mandatory, not required to be

visible .screen-reader-text class to hide labels.

Accessibility

PHPDoc is the standard for comments

Comments

https://phpdoc.org/docs/latest/references/phpdoc/basic-syntax.html

Single vs. Double Quotes

IndentationThe Tabs vs. Spaces Debate

Use Tabs, Not Spaces

Except….Blog - shawnhooper.ca Twitter - @shawnhooper

While we’re here…

Add a comma after the last item in your array declaration

Dirty…

Clean…

https://www.thewpcrowd.com/wordpress/development/dont-dirty-diff-tips-writing-cleaner-php/

{ }Braces

BracesUse braces instead of single line control structures.

BracesWorkaround: Use alternate structures like

if/endif and while/endwhile;

Shorthand PHP Tags

Optional Close PHP Tag

You don’t need a ?> tag at the end of your file. If you, make sure there is no white space after it.

SQLIf you have to write SQL Statements,

capitalize SQL keywords like SELECT, FROM, WHERE, ORDER BY.

SQLIf you have to write SQL Statements,

capitalize SQL keywords like SELECT, FROM, WHERE, ORDER BY.

In most cases though, you should use the functions provided by the WPDB Class.

or use $wpdb->prepare( $sql, $arg1, $arg2,… );

Naming Things

There are two hard things in computer science: cache invalidation, naming

things, and off-by-one errors.

- Phil Karlton

Naming Thingsfunction names should be lower case with

words separated by underscores.

Naming ThingsClass names should be uppercase with

words separated by underscores. Acronyms should be uppercase.

Naming ThingsConstants should be uppercase with words

separated by underscores.

Naming ThingsFilenames should be in lowercase,

separated by hyphens.

Classes should be prepended by “class-“ and be named with the name of the class.

Yoda Conditions

Variables on the right, constants and literals on the left.

Ternary Operators

Test that the statement is true, not false.

! empty() is allowed.

Keep Code SimpleNo:

JavaScript

Spacing

Naming Conventions

Variable and function names should be full words, using camel case with a lowercase

first letter.

myVariable = ‘value’;

Naming Conventions

Constructors intended for use with new should use UpperCamelCase:

function MyConstructor( ) ….

Validated

All HTML pages should be verified against the W3C validator to ensure that the markup

is well formed.

Self-Closing Elements

<br />

CaseFor Machines:

For Humans:

Quotes

IndentationIndent PHP blocks to match HTML. Ident to

match logical structure. Use Tabs.

Structure

Selectors

Properties

Media Queries

Comments

Back to PHP….

Tips & Tricks for Clean Code

Single Purpose MethodsBlog - shawnhooper.ca Twitter - @shawnhooper

Single Purpose Methods

Your methods should do one thing, and only that one thing. If not:

1. It reduces where it can be used

2. It becomes harder to test

Reduce Indentation

@shawnhooper - shawnhooper.ca

Reduce Length of Loops

Reduce Length of LoopsBlog - shawnhooper.ca Twitter - @shawnhooper

Keep Methods Short

If your method is longer than 20 lines of code, you can probably split it up into

smaller pieces.

Avoid Too Many Parameters

InjectionBlog - shawnhooper.ca Twitter - @shawnhooper

Injection

Clean Switch Statements

Automation

There are tools available to help you keep your code clean.

Code Standards

PHP CodeSniffer

Checks that your code validates to a specified PHP Standard!

PHP CodeSniffer

WP Enforcer

https://github.com/stevegrunwell/wp-enforcer

JSHint

Checks that your JavaScript validates to the standard.

Run with Grunt or Gulp

Unit Testing

PHPUnit

Unit Testing Framework to perform dynamic tests on your PHP Code.

Tape, Mocha, Jasmine

Unit Testing Frameworks for JavaScript Code.

UI Testing

SeleniumUsed to test your web application in a

real browser.

http://wordpress.tv/2016/06/20/ben-cool-ui-testing-with-selenium-in-php/

TenonAn automated testing tool for web

accessibility.

Code Reviews

2 sets of eyes are better than one!

Can be done remotely.

Can be baked into pull requests.

Don’t take any criticism personally.

ShawnHooper.ca

Twitter: @ShawnHooper

THANK YOU!

wordpress coding standards & best practices

Internet

ios coding best practices

becoming a wordpress coding master

secure coding practices

10up wordpress engineering best practices

automating good coding practices

c# coding guidelines and best practices€¦ · dot net...

wordpress best practices

best coding practices

filemaker coding standards & management best practices

secure wordpress development practices

4gl coding worst practices

coding best practices

secure coding practices for middleware

sql coding best practices for developers

the view - lotusscript coding best practices

wordpress best practices on aws

clean code, better coding practices

best practices-wordpress-enterprise

coding standards and best practices

wordpress best practices by billrice