The document outlines the development of a WordPress starter development kit aimed at creating a cohesive workflow for building and maintaining WordPress sites and applications. It details objectives such as enhancing project efficiency, establishing collaborative processes, and ensuring consistent file structures while emphasizing customization to meet specific challenges. The document also covers the tools and plugins utilized, future improvements, and advocates for a flexible approach to development that aligns with team needs and experiences.

1. BUILDING A
WORDPRESS STARTER
DEVELOPMENT KIT
BACK TO SQUARE ONE:

2. @KYLE_UNZICKER
Designer + Developer

3. OVERVIEW
• Building what now?
• How did you build it?
• Why didn’t you use ____ instead?
• What does the code look like?
• Is our universe real?
• What is true happiness?

4. WSDK? WTF?
• It’s not just a starter theme
• It’s not just a development framework.
• It’s a collection of tools that allows for the
creation of WordPress sites and applications
• It presents a unified workflow for teams
across multiple projects

5. LET’S DO SOME
WINDOW SHOPPING!
• Starter Themes
• _s, Bones, Roots
• Front-end Frameworks
• Bootstrap, Foundation
• WP Frameworks/Libraries
• Carrington Core, Timber, Bedrock

6. WHY NOT USE ______?
• We did…sort of.
• We need solutions that are tailored to our
unique set of challenges.
• We need something that we can maintain
ourselves.
• We’re not reinventing the wheel, we’re just
making one designed for the roads we drive on.

7. OUR OBJECTIVES
1. Get a headstart on each new project
2. Implement a collaborative process in building
and maintaining commonly used code.
3. Create a consistent development approach
across projects and teams.
4. Create a consistent file structure that makes it
easy onboard new team members

8. HOW WE BUILT IT
• We identified our niche
• We build large WordPress projects that must scale
gracefully.
• We build sites that can be accessed quickly and easily
from any* device
• We build sites that empower business owners to have a
say in how their content is published on a daily basis.
• We create admin experiences that make training simple.

9. HOW WE BUILT IT
• Teamwork!
• When you start a project, where do you
start?
• What tools do you commonly use?
• How do you prefer to keep your files
organized?

10. HOW WE BUILT IT
• We started with a starter theme
• Created an outline of the file structure, on paper
• We gradually added build tools
• Outlined a SASS structure
• What mixins should we include?
• What variables should we have defined?
• Outlined a JS structure
• How do we want to organize site wide functions and application
states vs. functionality specific modules (sliders, filters, etc..)
• What third-party js libs should we include?

11. HOW WE BUILT IT
• We added plugins
• What plugins do we use on every project?
• What functionality do we wind up building
multiple times?

12. SO, LET’S GET BACK TO

13. WHAT’S INSIDE?
• WordPress!
• Mark Jaquith’s WordPress Skeleton
• With WP as a git submodule, upgrading/
downgrading is a breeze.
• Allows us to have a local-config.php file

15. WHAT’S INSIDE?
• Debugging Plugins
• Debug Bar
• Debug Bar Console, Debug Bar Cron,
Debug Bar Action Hooks, Debug Bar
Extender

16. WHAT’S INSIDE?
• Optimization Plugins
• Tribe Object Cache
• Tribe Quick Profiler

17. WHAT’S INSIDE?
• Security Plugins
• Tribe Security
• Limit Login Attempts
• Tribe Glomar

18. WHAT’S INSIDE?
• Admin Plugins
• Tribe Branding
• Tribe Admin UI
• Tribe Admin Dashboard

19. WHAT’S INSIDE?
• Publishing Plugins
• Tribe Roles
• Tribe Panel Builder

20. WHAT’S INSIDE?
• Development Tools
• Node Packaged Modules
• Grunt Tasks
• Bower packages

21. [1] Build Tools

22. [1] Build Tools

23. WHAT’S INSIDE?
• Starter Theme
• Based off of _s
• Barebones templates
• SASS Architecture
• Grid, typography, forms, admin styles
• JS Architecture

24. T
[1] Theme Structure

25. [1] Theme Structure

26. [1] SASS Structure

27. [1] SASS Structure

28. [1] JS Structure

29. [1] JS Structure

30. [1] JS Structure

31. [1] JS Structure

32. WHAT’S NEXT?
• Identifying code we seem to build
from scratch every time and create
reusable packages
• Galleries
• Mobile navigation systems

33. WHAT’S NEXT?
• Standardizing back-end workflows
and approaches
• Difficulties:
• Developer preference on organization/
encapsulation can vary
• Certain approaches are only appropriate
for certain projects

34. WHAT’S NEXT?
• Maintenance
• Monthly Reviews
• Review what we’re currently using - are we
using everything we’ve included?
• Propose additions and discuss
• WCTO Additions
• Accessibility tools
• Responsive Image Approach

35. WHAT’S NEXT?
• Diving Deepr Into Defining Best
Practices
• code style guides
• Keep the documentation momentum going
through the duration of the project

36. WHAT’S NEXT?
• How can we extend this philosophy to
the rest of the agency?
• Standardizing a design process
• Deliverable file names
• Version control
• Improving our recruitment process
• Fine tuning our human resources approach
to on boarding new members

37. FINAL THOUGHTS
• “Don’t get intoxicated by a process or
fall in love with tools.” - Andrew Clarke
• This mindset will help both create a
standardized workflow for teams and
individuals, but also force you to reevaluate
your process.
• We didn’t add build tools to be fancy or
cutting edge - we had to prove that they work
for us and provide consistency and efficiency.

38. FINAL THOUGHTS
• Learn from others
• Hundreds of thousands of people can’t be
wrong (right?)
• Beat your own path
• No one knows your process and workflow
needs better than you.
• Listen to your teammates

39. FINAL THOUGHTS
• Resources
• A 1000-Hour Head Start: Introducing the _S
Theme
http://tiny.cc/1000hours
• A Modern Designer’s Canvas
http://tiny.cc/aclarke
• 10up - Best Engineering Practices
http://tiny.cc/10up
• Grunt For People Who Think Things Like Grunt
are Weird and Hard
http://tiny.cc/coyier

40. FINAL THOUGHTS
• Is our universe real?
• Probably. But maybe not. Read up on the
Holographic Principle
• What is true happiness?
• “Instead of searching for possessions and
achievements to make you happy, reflect on
who you are and find authentic joy within.”
- oprah.com

41. THANKS!
@kyle_unzicker