Gutenberg Block Development – 21 Free Video Courses

Developing with WordPress Gutenberg presents new challenges for developers, especially with the introduction of Full-Site Editing. WordPress developers should become familiar with Gutenberg development as this feature becomes more essential.

However, navigating this learning curve can be challenging, primarily due to the complexities of installing and configuring the development environment. To effectively tackle Gutenberg development, a solid understanding of JavaScript, Node.js, React, and Redux is required—these are the core pieces of this process.

While the official WordPress Block Editor Handbook contains plenty of information, it may be overwhelming to beginners. If you’re not sure where to start or are feeling lost, we’ve compiled a list of tutorials to help you navigate WordPress Gutenberg Block development.

Gutenberg Block Development Prerequisites

Before diving into Gutenberg Block development, make sure you understand the following:

  1. HTML
  2. CSS
  3. JavaScript
  4. React
  5. WordPress plugin development

These prerequisites will lay a solid foundation for your journey into WordPress Gutenberg development.

21 WordPress Gutenberg Development Tutorials for Developers

  • Staff Pick
    Ryan Welcher

    Ryan Welcher Codes

    Ryan Welcher works for Automattic as a WordPress Core Contributor and Developer Relations Advocate for Gutenberg and WordPress. Every Thursday at 10:30 a.m. Eastern Time, he streams on Twitch. He is highly knowledgeable in Gutenberg development. You'll be astonished to learn that all of these useful resources are completely free.

    Creator: Ryan Welcher

  • Staff Pick
    Jonathan Bossenger

    Developing blocks without React

    In depth step by step tutorial for creating Gutenberg Blocks for WordPress with plain JavaScript. In this series you will learn to build block without installing Node.js/npm, no build steps and no node_modules folder to wrangle.

    Creator: Jonathan Bossenger

  • Damon Cook

    Build an Accordion Block

    Create an accordion WordPress block with @wordpress/create-block. In this video, you will learn how to use --variant dynamic for building a dynamic block.

    Creator: Damon Cook

  • Staff Pick
    Rob Ruiz

    Creating Custom Attributes on Dynamic Blocks

    Create a WordPress dynamic Gutenberg block with easy and simple steps. You will learn how to create a php shortcode and turn it into a dynamic block.

    Creator: Rob Ruiz

  • viewSource

    Aurooba Ahmed and Brian Coords discuss technology, web development, and WordPress on a weekly basis. This channel contains in-depth tutorials such as "Getting Started with React Inside WordPress", "Digging into ACF Blocks for the Block Editor", and many more.

    Creator: Aurooba Ahmed and Brian Coords

  • Imran Sayed

    Advanced Gutenberg Block Development

    Advanced Gutenberg Block Development series by Imran Sayed. Imran is a WordPress Developer at rtCamp.

    Creator: Imran Sayed

  • Laurence Uchiha

    Building Native WordPress Gutenberg Blocks

    Laurence Uchiha, a WordPress Developer at Freemius, has a YouTube channel with an extensive collection of WordPress video tutorials. In his "Building Native WordPress Gutenberg Blocks" series, you'll learn about tooling, sidebar setup, adding Rich Text Content, and registering Block Format Types.

    Creator: Laurence Uchiha

  • Gutenberg Block Development

    Phil Sola of BRIGHT and James Koussertari of Gutenberg Market created wpBros Academy. In their YouTube channel you will find a tutorial on Gutenberg Block Development, that cover topis such as Gutenberg Block Editor UI, Creating a Multi Block Plugin, Building a "RichText" Paragraph Block, Adding block settings to the Settings Sidebar (Inspector Controls) and Inner Blocks.

    Creator: Phil Sola and James Koussertari

  • Krishna Kant Chourasiya

    Create WordPress Block Plugins for Block Editor

    When learning block development, new developers fears that there will be too many inconsistencies because of all the rapid changes made by WordPress Core team. Krishna's videos contains the most recent approach for creating a Gutenberg block, along with thorough explanations. This will help you comprehend the changes made by the WordPress core team later on.

    Creator: Krishna Kant Chourasiya

  • Nick Diego

    Let’s Build a Custom Block in One Hour

    Over the years, Nick Diego, a WordPress Core developer and Developer Relations Advocate, has published an overwhelming number of tutorials on block building. Encouraging developers in adopting the Gutenberg block by generating in-depth explanation articles, videos, WordCamp talks, and so on. This video will teach you how to make a WordPress block in 1 hour.

    Creator: Nick Diego

  • Joshua Herbison

    How to create a WordPress Gutenberg Custom Block

    Joshua Herbison's step-by-step WordPress development tutorial on how to make a Gutenberg Block. It can be a good starting point for anyone interested in learning Gutenberg block development. If you know a little HTML, CSS, and JavaScript, you are good to go.

    Creator: Joshua Herbison

  • Greg Ziółkowski

    Automate Gutenberg block development in WP projects

    Learn how to use JavaScript developer tools to create WordPress plugins and blocks. Greg Ziókowski's webinar is useful for WordPress agencies and developers aiming to streamline their WordPress development workflow.

    Creator: Greg Ziółkowski

  • Greg Ziółkowski

    Level Up Block Building Skills

    Greg Ziókowski's WordCamp Europe 2022 session will teach you how to improve the block editing experience by using custom blocks. The presentation not only covered advanced programming techniques, but it also provided valuable insight into the process of submitting a new plugin to the Block Directory.

    Creator: Greg Ziolkowski

  • Aurooba Ahmed

    WordPress Block Editor Development

    Aurooba Ahmed, co-host of the viewSource show and a WordPress Core Contributor, has plenty of useful videos on WordPress-related topics. These videos cover a variety of topics, such as using theme.json in WordPress themes, ways for locking down or activating objects in the WordPress Block Editor, and the simple process of adding several blocks to a WordPress plugin.

    Creator: Aurooba Ahmed

  • Brian Coords

    Custom Responsive Settings in Gutenberg Blocks

    Brian Coords, HDC's Technology Director and co-host of the viewSource show, has a YouTube channel with videos on a variety of topics, including Easy custom blocks with InnerBlocks in Gutenberg, WordPress Custom Lists with Register Block Style, Gutenberg Blocks Custom Responsive Settings, Tutorial ACF Blocks Post Carousel, Image management in Custom Gutenberg and many more.

    Creator: Brian Coords

  • Rabiul Islam Rob

    WordPress Gutenberg Sidebar Plugin Development

    Robiz Show was created by Rabiul Islam Robi, a WordPress Engineer at rtCamp. His videos cover a wide range of topics, including WordPress, Gutenberg, Vue.js, and many others. WordPress Gutenberg Sidebar Plugin Development by Rabiul is a fantastic contribution, and you'll be surprised to realize that it's a free tutorial rather than a paid course.

    Creator: Rabiul Islam Robi

  • Zakaria Binsaifullah

    Custom Gutenberg Block Development

    Zakaria has a considerable number of WordPress Block plugins that are hosted on the WordPress plugin repository. You can learn from a developer with hands-on experience maintaining WordPress block plugins used by thousands of users. His YouTube channel contains A Complete Video Course on Developing the Custom Gutenberg Block with Native Components.

    Creator: Zakaria Binsaifullah

  • Birgit Pauli-Haack

    Gutenberg Times

    Birgit Pauli-Haack is a WordPress developer advocate, curator of Gutenberg Times, and podcast host of the Gutenberg Changelog. Birgit Pauli-Haack hosts a bi-weekly podcast where she discusses things Gutenberg block editor.

    Creator: Birgit Pauli-Haack

  • Greg Ziółkowski

    Block Development with Scaffolding

    "How to Start Block Development with Scaffolding" is a fantastic WordCamp talk by Greg Ziókowski, a WordPress Core contributor. Greg demonstrated how to make the most of the Gutenberg core team's scaffolding command.

    Creator: Greg Ziółkowski

  • Lee Shadle

    Blazing fast block development

    Lee Shadle of blockHandbook shares advice on faster and easier Gutenberg block development. It is, in my opinion, one of the most insightful talks of WordCamp Europe 2021.

    Creator: Lee Shadle

  • Joshua Copeland

    Plugin Development in a Block Editor World

    Joshua Copeland, CTO of Remote Dev Force, described the foundations of Blocks and the power of creating custom blocks for special content in this WordCamp Las Vegas 2019 talk.

    Creator: Joshua Copeland