Learn WordPress Block Editor Development
Together, we’re going to unlock the power of the block editor and build your modern workflow.
The Ultimate Block Development Course
Get early access to the most comprehensive and approachable WordPress block developer course available.
- Learn how blocks work to extend existing ones or build new ones
- Stick close to core with no dependency on paid plugins or frameworks
- Feel confident that anything is achievable in the block editor
Start your block developer journey.
We’ll go step-by-step through the process of extending the block editor from setting up our environment to building custom blocks and plugins.
Module 1. Introduction
Welcome to your block editor masterclass.
Coming Soon
- Welcome! “Who am I” and other important questions
- The block editor, not your classic WordPress
- We’re going to write code, but it’s ok
- Alternatives to custom blocks (ACF, Wicked, PineGrow, etc) and why we’re sticking close to core
- The Block Editor UI – a basic vocabulary lesson
- Intro to WordPress Documentation
Module 2. Your Dev Environment
Like a fine chef, we set up our mise en place.
Coming Soon
- Options for local WordPress development environments
- What my VSCode looks like and your’s can too
- Cursor, GitHub Copilot and whether we’ll be using AI autocomplete
- Version control – the developer’s security blanket
- Where do I keep my blocks, in a theme or a plugin?
- WordPress Scripts – the WordPress build process
- The Create-Block Package – jumpstart your blocks
Module 3. Block Basics
What a block is and how it works in the editor.
Coming Soon
- Block.json Part 1 – a block’s single source of truth
- Block.json Part 2 – block attributes
- Block.json Part 3 – block supports
- Block.json Part 4 – scripts and stylesheets
- JavaScript in blocks – index.js, edit.js and (sometimes) save.js
- PHP in blocks – render.php
- Block Assets – style.css, editor.css, view.js
- Block Editor Slot 1 – The Block Toolbar
- Block Editor Slot 2 – The Inspector Controls
- Blocks in action – takeaways from three core blocks
Module 4. Extending Core Blocks
Coming Soon
More often then not, you don’t actually need a custom block
- When do you really need a custom block?
- Options for extending blocks – PHP vs JavaScript
- Registering Block Styles, Stylesheets, and custom JavaScript
- Building Block Patterns
- Registering Block Variations
- Mapping custom data with the Block Bindings API
- The render_block filter – the last refuge for server-side manipulation
- Block Extensions – a custom solution
Module 5. Our First Custom Block
For those about to block, we salute you.
Coming Soon
- Intro to Dynamic blocks – why we’re not building static blocks
- Intro to JSX – why does my HTML look like this
- Understanding Attributes and “State” in a React App
- Building with core’s UI Components library
- Everything that’s possible with server-side rendering
- The ServerSideRender Component
- Handling custom JavaScript
- Importing libraries and packages into blocks
Module 6 – Inner Blocks
Lorem ipsum
Coming Soon
- The InnerBlocks Approach – the custom block that isn’t too custom
- InnerBlocks with Dynamic Blocks
- Template Lock – Locking and controlling inner blocks
Module 7. Advanced Concepts
How a giant React application is actually helpful
Coming Soon
- Understanding Filters in WordPress JavaScript
- Understanding SlotFills in WordPress JavaScript
- What is the “Data Layer” – How do I run WP Queries in the Block Editor
- Access and edit the current post with getEntity and getEntityProp
- Access and edit any site data with the useSelect hook
- Adding a sidebar panel to the editor
- Remove blocks from the block editor
- More examples coming soon.
Bonus 1 – Block Walkthroughs
We’re building three custom blocks – start to finish.
Coming Soon
- Bonus Example 1 – The ultimate carousel block.
- Bonus Example 2 – A related posts block with a post picker field.
- Bonus Example 3 – Coming soon.
Warm up with my free video series
7 Tools for Modern WordPress Development
Join 2,000+ subscribers who are learning modern WordPress development.
Meet Brian Coords, your Gutenberg Guru
Brian Coords is a WordPress developer, writer, and instructor with over a decade of experience in WordPress, working with clients ranging from UCLA and Harvard to WordPress.com.
His videos are available on YouTube, and he co-hosts a WordPress development show called viewSource. You can also find his writing on industry publications like WordPress.org, WP Tavern, MasterWP, The WP Minute, and his personal technology blog.
Brian Coords is a WordPress developer with 10 years experience developing, teaching, and managing agency teams.
Join the waitlist.
We’re in pre-launch mode. Sign up below to get notified with an exclusive offer when the launch is ready.
Early Access Benefits
- Purchase at a one-time-only discounted price
- Access each lesson as soon as it’s ready
- Support the direction of the course by providing early feedback
Future Block Developers, Join Here
Frequently asked questions
Looking for clarification? Browse our FAQ’s or contact us directly and we’ll sort you out.
Content
When will the full course be available?
Right now the course is in early access, meaning you’ll be getting each new module as it’s recorded and released. The general cadence will be one module per month.
Who is the course for?
Anyone with basic WordPress developer experience. If you’ve tinkered around with custom themes, are comfortable setting up a local WordPress environment, then you should be good to go.
Do I need to know React?
React, not really. Basic JavaScript? Yes. Eventually, a deep understanding of React and advanced JavaScript will be helpful, but not for this course. In fact, building WordPress blocks is a great way to learn the concepts of React in a safe and limited environment.
How long is the course?
This will be determined as content is recorded, but current estimates are at a minimum of 3 – 4 hours of content, including three “start-to-finish” custom block builds.
Is the course content set?
Mostly, yes. I may move some things around or add new topics, but none of the topics here will be removed.