How To Become A Full Stack WordPress Developer

This post will tackle the issue of how to exactly become a ‘full stack WordPress developer’. In general a full stack developer is someone with the knowledge and skills to be able to handle not only the front-end or back-end, but both, and everything in between. Starting from server and hosting, to in-depth understanding of required coding languages, to APIs, user interface and user experience, acquiring this skill-set is a tall task for even the most dedicated or obsessed learner.

The constants of development do not change ( Server and hosting environment, date modelling etc) do not change. But there are a few extra things to add to your toolbox if you want to consider(and maybe market) yourself as a full stack WordPress developer:

The Foundations Of WordPress

If you’re even considering trying to become a full stack WordPress developer, you must already know the languages at the foundation of WordPress. (If not you might want to look into our other post about getting started with WordPress development here.)

Other than obvious PHP, HTML/CSS and now more and more JavaScript, WordPress also makes use of different code libraries, perhaps most notably; jQuery and TinyMCE. This is a complete list of all the 3rd party libraries it uses:

• Backbone.js
• cropper
• jQuery
• jQuery.imageareaselect
• jQuery.Jcrop
• jQueryUI
• swfupload (deprecated)
• ThickBox
• TinyMCE

Note: They are in alphabetical order and not in order of importance.

jQuery is a popular JavaScript library that is an integral part of WordPress. It is behind many of the animations as well as front end user interactions, among other things. As an example, obviously shown in the list above, WordPress uses jQuery to handle the cropping of images.

Backbone is a JavaScript library that developers use to structure code according to MVC pattern. (Model, View Controller) Basically separating the code based on what handles the data(Model). The visual representation of that data in HTML/CSS (View). And finally a controller that accepts input and uses that to send commands to part 1 and 2.

TinyMCE is the in browser text editor that WordPress.org uses in it’s admin area. Calypso does not use TinyMCE however, but the current .Org open source version still ships with TinyMCE included as part of the core.
The rest of the libraries are all smaller libraries included to serve a single, smaller purpose and perhaps not worth as much attention as the others.

(Bonus: React)

While not officially included in the WordPress.org package, WordPress.Com works with the extremely popular React JavaScript library. They even used it to build a completely new admin area one that doesn’t rely on TinyMCE for it’s content creation an editing in the admin area.)

WordPress Template Hierarchy

Before we deal with some of the more complex workings of WordPress, there is the sometimes confusing template hierarchy. It’s important to have a complete mastery of the template hierarchy when developing themes for clients, as you can save them trouble and energy by creating a theme that automatically applies the correct templates to the correct pages.

An easy way to get more familiar with the template hierarchy, is to take a closer look at the visual representation pictured above over at wphierarchy.com. You can also read some of the articles diving into the template hierarchy in greater depth.

File Loading Order In WordPress (Code Priority)

A common question many beginner WordPress developers have when they are first starting out, is whether the Theme’s functions.php file is loaded before or after plugin files. This is relevant when it comes to code priority, as the code dealing with the same things that is loaded the latest will be the code that controls the final outcome.

The theme files are in fact loaded after plugins, but, the way you are asked to add most functions to your themes and plugins, hooking and executing them at the init hook, priority in most cases is not determined by file order. Instead, you can actually assign a priority to your function in the add_action() function.

For more information you can check out a great stackexchange answer that deals with explaining exactly this.

WordPress Functions

WordPress functions are the backbone of a lot of what you can do with WordPress. You often rely almost solely on them when developing themes.
The funny thing about the sheer number of WordPress functions these days, is you might find yourself developing a custom function in a theme or plugin, just as you realize WordPress has already added that to core.

(And if you haven’t, trust me, there are few things more frustrating than noticing that after spending hours of trial and error and fine-tuning, you’re re-inventing the wheel, and there was an unlimited wheel supply right outside your field of vision all along.)

So to avoid ending up in that situation, as well as just bolstering your WP development ability in general, it’s important to get to know all the most important WordPress functions.
Important WordPress functions include:

• Everything in the loop(get very familiar with the loop)
• Widgets
• Menus
• Adding custom post formats
• Metadata

And much more.

To get more familiar with functions, take a look at the function reference in the codex, or in the WP Developer’s handbook (The fact that there’s 99 pages of them should give you some idea of how much you can do with WordPress without ever having to write a custom PHP function.)

WordPress APIs

API is a term that refers to code that allows a program to communicate with another program. In addition to a host of internal APIs that help different parts of WordPress communicate and work together, WordPress recently included a REST API as part of core. The REST API allows WordPress to fluently communicate with websites and programs that are not WordPress or even written in PHP. For example, you can have a WordPress membership site, and then get date from and even submit new information to that WordPress site using an Android or IOS application.

Key APIs to learn for a WordPress developer:

• Theme Customization API
• Theme Modification API
• REST API

The theme customization and modification APIs are important for any developer to get familiar with because of their necessity in theme development. They work with the theme customizer to allow the end user to make changes to the design of their website without ever having to mess with the source code.

And the REST API is obviously important for all the reasons we went over already. The API allows you to build complex applications using WordPress as a base. So anyone labelling themselves a full stack WordPress developer should be extremely familiar with how it works and realistic use cases.

There’s a complete overview of all WordPress APIs in the codex

Conclusion

Just as becoming a full-stack developer in general requires in-depth knowledge of every stage of getting a website or application from the server to user, a full stack WordPress developer must have the same deep understanding of every nook and cranny of WordPress. This is on top of the understanding of the languages and libraries under the hood.

A tough ask even for a seasoned developer, but you might get there. However, if you’re a beginner, the day you can attach that moniker to yourself is many years (if not decades) down the line. However, even if you are just starting out, hopefully this post can point you in the right direction for elements of WordPress core to get more familiar with.