WordPress.org
Get WordPress

Developing your first WordPress Block

Welcome to the first week of the Learn WordPress Developing your first WordPress Block course cohort.

Hey there, and welcome to this Learn WordPress course cohort.

Allow me to introduce myself. My name is Jonathan, and I’ll be your facilitator for this cohort. I’m a sponsored member of the training team, and I’m excited to share this knowledge with you.

I wanted to take a moment to describe how this cohort differs from a typical online course.

In a typical online course, you work through the course material on your own, at your own pace. There are no deadlines or check ins, but also no way to get help from the course creator or anyone else taking the same course.

In this cohort, you’ll be working through the course material at the same time as the rest of the group taking part in the cohort. You’ll be able to ask questions and get help from the other participants, and I’ll be there to help out as well. However, this does mean there is a time constraint. Each week you would need to be able to complete the work assigned to you for that week.

The goal of this cohort is to try and emulate the experience of taking a course in person, but in an online setting. I hope that you will find this process beneficial, and that you will be able to learn a lot from this course.

Before you begin, I would like to remind you of the weekly synchronous sessions that are part of this cohort. These sessions will be facilitated via Zoom, and will be recorded and posted to the course page for those who are unable to attend. The sessions will be held every Wednesday at 08:00 AM UTC and the link will be shared with you beforehand on Slack. I would like to recommend that you attend each session, as it will give you an opportunity to ask questions and learn together with your fellow participants.

The first Zoom session will be held on Wednesday the 6th of September, and it will give everyone an opportunity to introduce themselves and ask any questions they may have. We will also include a short section introducing the course content for that week.

The course content for each week will be made available to you on the Monday of that week. You will have until the following Wednesday to complete the work for that week. So for example, this week’s course content is already available, and you have until the 13th of September to complete the work for this week. During the Zoom session on the 13th, we will discuss the work for this week, answer any questions, and introduce the work for next week. This cycle will continue until the course is complete.

I would like to encourage you to complete the work for each week before the Zoom session for that week, as it will give you an opportunity to ask questions about anything you may be struggling with.

Lastly, I will be creating a Slack group DM, which will include all the participants of this cohort. This will be a place where you can ask questions, and get help from the other participants. I will also part of that group DM.

I will not be available for questions at all hours, but I will be holding office hours between 08:00 am UTC and 09:00 am UTC every day, the same time as the Wednesday Zoom sessions. During these office hours, I will be available to answer any questions or discuss anything related to the course.

One final note. This course cohort follows the WordPress Community Code of Conduct which you can find at https://make.wordpress.org/handbook/community-code-of-conduct/.

Please take a moment to read through it, and familiarise yourself with it. If you have any questions about it, or if you feel anyone that is part of this cohort is acting in a way that is inappropriate, threatening, offensive, or harmful, please reach out to me via private message in Slack. If, for whatever reason, you don’t feel comfortable to chat with me about it, you can also email reports@wordpress.org, and a member of the community incident response team will get back to you.

It is important that we all share this space without fear of harassment or discrimination, and I will do my best to ensure that this is the case.

With all that out of the way, I would like to wish you all the best for this course, and I hope that you will find it beneficial.

Happy coding!

Additional resources

Start the course

When you’re ready to start, click the button below to access the course content.

Week 1: Introduction, preparing your environment for block development.

During week 1 you will focus on preparing your development environment for block development. You’ll learn about the tools you need to have installed on your computer, and why they are necessary.

Lessons

Getting set up Installing Node.js and npm All about the terminal Why install Chocolatey for Windows? Why install nvm to install node.js, and npm Week 1 wrap up

Week 2: Using create-block to scaffold a new block.

During week 2 you will learn how to use the create-block tool to scaffold a new block. You will learn about the different pieces of code that create-block generates, what they are used for, and how they help with block development. At the end, you’ll also start making some small changes to the block files.

Lessons

Welcome to week 2 Introducing create-block Why use create-block? What does create-block generate? package.json block.json Activity: Making some changes and building your block Week 2 wrap up

Week 3: My Reading List, anatomy of a block, block styling, block supports.

During week 3 you will start developing the My Reading List plugin while learning more about the different pieces of your block. You’ll also learn about block styling and enabling specific features through block supports.

Lessons

Welcome to week 3 My Reading List Block Registration The import declaration Internationalisation Block Styling useBlockProps Wrap up

Week 4: Interacting with WordPress data.

During week 4 you will learn how to interact with core WordPress data in your block.

Lessons

Welcome to week 4 Accessing WordPress data Developer Tools and the Console JavaScript concepts React concepts Block editor concepts Wrap up

Week 5: Block attributes, block components.

During week 5 you will learn how to create your own reusable block components to simplify your code and make your block’s data user-editable with block attributes and block controls.

Lessons

Welcome to week 5 Block Components, Block Attributes, and Block Controls Block Components Block Attributes Wrap up

Week 6: Dynamic blocks.

During week 6 you will learn about dynamic blocks, and how to develop them.

Lessons

Welcome to week 6 The save function, and dynamic blocks Dynamic blocks Preparing your block plugin for distribution Wrap up