WordPress Developer Roadmap (Beginner to Advanced)

Diving into the world of WordPress development? You’re not alone! WordPress powers many websites we visit every day. If you want to earn money through freelance projects or as a salaried developer, here is a WordPress developer roadmap to help you connect the dots and gain confidence, experience, and provide more value to increase your earning potential.

WordPress Development Roadmap: Learning WordPress Development Step by Step

For those venturing into WordPress development, the journey can be as straightforward or as intricate as you choose. Let’s explore a basic approach, and I will point out resources to consider along the way.

HTML

  1. Basic HTML tags, elements, and attributes. Learn about headings, paragraphs, links, lists, headlines, images, etc. Basically, if you can create a simple HTML file and load it in your browser, you’re on the right track.
  2. HTML and the DOM. This will become more important later when utilizing Javascript, but getting started with a browser’s inspector tools will help you learn how to debug any issues with your HTML files, and begin understanding the difference between HTML, and the DOM (Document Object Model).
  3. Images, Forms, SVG. Of all the HTML elements, there tends to be the most frustration working with images, forms, and SVG. Form elements can render different in every browser, so sometimes leaning on a simple form library can work wonders. Images can be complex as well, so learning about aspect ratios, lazy loading, srcset, among other image topics is valuable. SVG has its own unique syntax and is generally exported from a design tool, so learning basic attributes and how they alter the SVG helps. Focus on learning the viewBox and height and width attributes for sizing.

CSS

  1. Basic selectors and syntax: Start with selectors, properties, and values. Learn about the cascade, which selectors are more specific than others, and generally use CSS classes for most of your styling in order to keep things simple and stay out of override hell.
  2. Styling Fonts and Learning Box Model: From there, dive into styles for font and text properties, background, and the box model (margins, borders, padding).
  3. Layout and Responsive Design: Learn how to make websites look good on all devices using media queries and flexible grid layouts.
  4. CSS Libraries and Frameworks: Explore lightweight libraries like Tachyons or PureCSS, then move into build tools like Sass or TailwindCSS. While learning to write CSS from scratch is incredibly valuable, libraries and tools can help you with organization and efficiency.

Experimentation is important. I’ve tried dozens of different libraries, frameworks and tools over the years when writing CSS, and each has their strength and weaknesses.

Sometimes frameworks are super handy if you are prototyping and there are no design comps to work with, such as when creating a custom WordPress plugin.

Other times frameworks are too opinionated if you are working from a custom design comp, and a mix of utility classes and custom CSS can serve your web development process better.

Being able to quickly learn how to work with these web technologies requires strong fundamental knowledge of CSS, so definitely master the basics first.

PHP

  1. Basics: Understand PHP syntax, variables, and data types. During this time you will also need to setup a local or private environment using something like MAMP. However, there are online tools you can use to practice basic PHP scripts, such as
  2. Control Structures: Learn if-else statements, loops, and switches.
  3. Functions: Familiarize yourself with built-in functions and how to create custom ones.

Advanced PHP

  1. Arrays & Strings: Dive deeper into PHP arrays (indexed, associative, multidimensional) and string manipulation functions.
  2. OOP (Object-Oriented Programming): Understand classes, objects, inheritance, and polymorphism. WordPress does use some OOP, so a strong grasp will help with understanding the syntax.

Databases with PHP

  1. MySQL: Learn basic operations like creating, reading, updating, and deleting records in a database using PHP. MAMP comes with a simple PHPMyAdmin interface which is helpful for running some simple database queries as practice.
  2. PDO (PHP Data Objects): Beginners using PDO should focus on understanding prepared statements (to prevent SQL injection), binding parameters, fetching results using different fetch styles, and handling database connections and exceptions. This will be most useful for plugin developers.

Basics of WordPress Development

  1. Setup: Install WordPress locally using tools like MAMP or Local. Without some type of local environment, you won’t be able to host WordPress sites on your own computer.
  2. Themes and Plugins: Understand the anatomy of WordPress themes and plugins. Start by modifying existing themes or creating simple plugins. Create custom themes from scratch. It’s a great practice, and often simpler than you might think.

Advanced WordPress Development

  1. Custom Post Types & Taxonomies: Learn how to create custom content structures. This can really come in handy in theme development by being able to the modify the content management system structure to make content and site editing easier and more organized. Personally I’ve used custom post types far more often than custom taxonomies, as categories and tags seem to work well quite often.
  2. Hooks (Actions & Filters): Grasp the WordPress event-driven architecture to customize and extend its functionalities.
  3. Custom Fields and Custom Blocks: Advanced Custom Fields is the most popular way to add custom fields to a page and leverage within your templates. They also support creating custom Gutenberg blocks as a paid feature. Alternatively, if you want to create custom fields and Gutenberg blocks through code, Carbon Fields is a great open-source codebase.
  4. APIs, Headless, Templating: Since WordPress has the ability to leverage the data in the database through an API, Headless has emerged as a way to decouple the backend codebase from the front-end. Alternatively, if you want to stick to PHP but want an upgraded experience with more readable template syntax, Timber (which leverages the Twig template language) is worth exploring.

Understanding the Landscape: WordPress Developer vs Web Developer

While there is a difference between being a WordPress developer vs a general web developer, it’s best to think of a WordPress developer as an area of specialty with specific skills and responsibilities under the web development umbrella.

Let’s delve deeper into their differences and similarities, then explore what to learn and how each topic area applies to WordPress projects such as WordPress themes or custom plugins.

Core Competencies

While a web developer may learn any number of different backend languages such as Java, Python, Ruby or NodeJS, WordPress relies on PHP as its core backend language.

Essentially, WordPress acts as software, or a C.R.U.D (Create, Read, Update, Delete) application which is essentially a relational database management system.

When you login to the dashboard of WordPress and update or change posts, for example, this is actually updating records in the MySQL database.

So while a web developer may learn any number of databases such as MongoDB, PostgreSQL, or Microsoft SQL Server, a WordPress developer’s main focus is MySQL and their PHP knowledge is used to connect to the database and run operations.

Thankfully, WordPress provides a very convenient architecture, so you don’t have to worry about the details of how WordPress creates or deletes records in the MySQL database. The base-level code exists in the WordPress core, which is always being managed and updated by open-source contributors.

However, the convenience of WordPress and it’s architecture for building websites (using themes, templates, and blocks) can also cause confusion for beginner developers.

It’s best to always keep in mind that WordPress is just an opinionated way to create and manage websites, and is built on principles of web development and open-source technologies (PHP, MySQL, HTML, CSS, and Javascript).

Therefore, learning these skills will allow you to be a more creative and competent problem-solver and perhaps even come up with new ways to extend WordPress and its capabilities. (This is precisely how features like Gutenberg blocks and GraphQL for Headless WordPress emerge onto the scene.)

Specialization vs Versatility

Even though becoming a WordPress developer is in itself a specialty, you can narrow your focus even further by focusing on specific areas like creating custom plugins, custom themes, or other tangential areas of a WordPress website like SEO or CRO.

Becoming a specialized WordPress developer can mean higher salaries, or even allow you to create entrepreneurial opportunities.

Building WordPress projects on the side can have a big impact, and play a key role in allowing you to become a more versatile WordPress developer.

Each has its advantage, but ultimately, as long as you keep learning during your journey from being a beginner to an advanced WordPress developer, you will have skills that are in demand.

Every veteran WordPress developer will have a different outlook on specialization vs versatility.

WordPress Development Roadmap: Final Thoughts

By simply installing WordPress locally, and leveraging a learning resource to learn basic syntax of website development, you are well on your way to learning how to create custom themes and professional websites.

The first WordPress theme I created, which landed me my first job, is still being used today, and I now make a living as a WordPress developer.

There is no way around learning all the technical stuff involved in different WordPress specific technologies, but having a core understanding will allow you to set up site specific configurations and bring lots of value to the marketplace.

Similar Posts