Hi! Today we will look at a detailed guide on how to master WordPress from scratch as a developer.
Let’s say you don’t know anything about web development yet and you want to learn how to create WordPress sites. To do this, you need to consistently learn html-layout, JavaScript and PHP languages, learn how to work with databases and, in fact, learn how to develop on WordPress itself. Let’s take a closer look at the points.
HTML-markup and technologies in the web
This is the base. Whether you end up working with WordPress, other CMS or frameworks, or even decide to become a front-end developer, you need to know the basics. Without this, you will not understand how web pages are formed, and with the current development trend, you will not be able to develop on WordPress at all. More on the trend at the end.
HTML — hypertext markup language
It is a layout and markup language for web pages. It allows you to create the structure of web pages and content. Without it, not a single web page on the Internet could work.
You can learn the basics in 1-3 weeks. The internet is full of free HTML courses, both on YouTube and from various online schools.
CSS — cascading style sheets
If HTML is about markup, then CSS is about page design. It allows you to arrange the site in accordance with the design layout: specify the size and location of elements, text colors, blocks, fonts, their sizes, and so on. It also allows you to make a mobile version of the site.
The study will also take 2-4 weeks. There are also many free courses on CSS on the Internet.
Important: until you make at least a few pages in accordance with the design layout, do not use absolute positioning – position: absolute. Although this is a useful and necessary tool, it is used by beginners in a completely wrong way, because it seems to a beginner to make it easier to lay out a page without many problems, but in reality a person learns to do the job completely wrong. Therefore, it is better to first learn how to work without it.
CSS-frameworks (optional)
CSS is a subtle page styling tool. But in layout there are many typical elements and solutions that can be found in most projects. And in order not to reinvent the wheel every time, you can master CSS frameworks that have already solved most of the tasks of page design. The most commonly used are Bootstrap and Material.io. I personally only use some elements from Bootstrap.
Web-technologies
Along the way, you need to learn about how the Internet works in general: what is a client, server, DNS server, TCP-IP, FTP, SSH, port in computer networks, hosting, domain, SSL. Now it may seem complicated and scary, but in reality it only seems. You don’t have to dive into the depths of these technologies, although it’s helpful. You just need to understand what it is, what it is for and how it works. This will greatly simplify your life when you start working, and in general will help in your development.
You also need to learn how to work with the Linux terminal, even if you have Windows – in your work you will most often come across Linux, because most servers run on it.
All these technologies can be studied in parallel, no matter at what stage you are now.
JavaScript and PHP
WordPress (WP) works on their basis, and without knowledge of these programming languages, you won’t go far in WP development. Moreover, if earlier it was possible to do only PHP with minimal knowledge in JavaScript (JS), now in-depth knowledge in JavaScript is also necessary, because WordPress is developing towards working with JavaScript.
PHP
PHP is needed to manage interaction with databases, to save content, manage users, configure and refine the system itself for your tasks, as well as to interact with external services.
In PHP you need to learn the basics and, object-oriented programming. I also strongly advise you to study the PSR-12 coding standard. He gives advice on how to properly format the code so that it reads well. For WordPress, see PHP Coding Standarts.
JavaScript
Don’t confuse JavaScript and Java. Although the names are consonant, in reality they are completely different languages.
JavaScript in WordPress is needed to work with content (although this is far from its only purpose and possibility). Surely you have already tried the WordPress admin panel and tried the Gutenberg block editor, which allows you to collect page content from blocks. The potential of this editor is huge, and the blocks themselves for Gutenberg are created just in JavaScript. Yes, there are solutions in PHP, and I talked about one such solution, but they are limited both in capabilities compared to JavaScript development and in the development potential.
In addition to the already working Gutenberg, block theme management will soon be released from beta testing. This means that you can change the appearance of the entire theme, and not just the content of the page, using blocks. And the development of blocks for such control will also be in JavaScript. In addition to the JavaScript language itself, jQuery, WebPack, React.js, and JSX are worth learning for development.
jQuery (optional)
Just like CSS has its Bootstrap framework, JS has its own frameworks. One of them is jQuery. Like Bootstrap, it solves many common problems that JavaScript developers have. To put it bluntly, today this technology is obsolete. But jQuery still runs the WordPress admin, many modern themes, and many developers use them for new projects. therefore, knowledge of jQuery is required to support and refine such projects.
Experienced developers in this place will throw tomatoes at me, they say, this is a heavy and ancient technology. In part, they will be right, but I am not a supporter of running after fashion trends (one of which is jQuery hate) and I prefer to use effective tools to solve tasks. Therefore, although it is better not to use it for new projects, it is needed to maintain old projects and refine the WordPress admin area.
WebPack
Now there may be a lot of words incomprehensible to you, but do not be alarmed. I think when you get to this point in your training, everything will be much clearer to you 🙂
This is a program that compresses (i.e. reduces in size) and converts your JavaScript code so that it is compatible with more devices. To develop Gutenberg blocks, you will need a WebPack plugin called “Babel”.
For example, you can create an app or a Gutenberg block and use the JSX syntax because it’s easier and clearer to develop. But the browser will not understand this syntax and nothing will work. But if we let it be processed by WebPack and Babel, then they will give us a new JavaScript code that is understandable to the browser, at a time when it would be oh so difficult and inconvenient for us to write and maintain such code ourselves.
React.js — framework for creating and maintaining web interfaces
Like jQuery, it’s a JavaScript framework. Basically, it is needed to create and maintain interfaces, requests to the server and data processing on the client side. To understand what React is, think of YouTube as a service in general. Or VK. Each of the services is a huge system, with a large number of elements, buttons, input fields and functionality that works right in your browser. If all this was created in plain JavaScript, then it would be extremely difficult to maintain and develop it all. But React and other frameworks like it allow you to create, maintain and evolve the interface of each service with much less effort.
By the way, the JSX I mentioned above is part of React.js, so don’t worry if you don’t understand what it is. Think of it for now as something that you will need to learn sometime later. When you’re ready for it, I’m sure you’ll love this thing 🙂
Databases and MySQL
In the database (DB), as it is not difficult to guess, data is stored. As a rule, the content of the site, its settings, information about users, order history (if it is an online store, for example) is stored in the database. Without a database, no modern CMS will work, because it will have nowhere to store data. Therefore, the tools for working with the database need to be studied. For WordPress, this is primarily MySQL. Optionally, you can also learn PostgreSQL.
MySQL
It is a relational database management system that WordPress uses. Just it allows us to work with the Database itself: create and delete the database and database tables, manage their structure, create, modify and delete data from the database. All this is done in the SQL language, which also needs to be learned for advanced development.
Back-end development on WordPress
So far, we have been talking about the basics to get to the most important thing – WordPress development. At this point, you should already understand and be able to work with HTML, CSS, JavaScript, PHP, and MySQL. Now we need to learn back-end development in WordPress.
So, we study the following topics in order:
- WordPress themes: how to create your own, what are child themes, WordPress theme file structure.
- What are posts (post), their types
- Taxonomies and terms
- Meta fields, managing them and their data
- WordPress Menu and Walkers
- Ajax requests in WordPress
- Security in WordPress
- Working with users
- Creating plugins in WordPress
- REST API
Inference
That’s probably all. I wanted to write a concise and helpful guide on how to become a WordPress developer. It didn’t work out succinctly, but I hope it’s useful.
If you see flaws in the article or you have questions – feel free to write them in the comments – I will answer everything 🙂
Leave a Reply