Home » The Gutenberg Development Course from Zac Gordon

Gutenberg Development

A Big Change is Coming to WordPress Development!

Perhaps you have heard?  Gutenberg is JavaScript driven, uses React under the hood, and provides an interactive single page interface for editing content as blocks.  This adds new abilities, libraries, toolsets and ways of developing within WordPress.

“Gutenberg takes what we love about WordPress and adds the benefits of modern JavaScript.” ~ Zac Gordon

Who is This Course For?

Though Gutenberg will affect different developers in different ways, this course will specifically help the following:

  • Plugin Developers building shortcodes, widgets or custom fields.
  • Theme Developers looking to style Gutenberg and set default block templates.
  • Agencies who need to stay up to date on major changes coming to WordPress.

What Will You Learn?

In this course you will gain a solid foundation of how to start developing with the new WordPress editor.

  • How Gutenberg Core works under the hood
  • Important JavaScript libraries that ship with Gutenberg
  • How to create custom blocks with core and custom components
  • Options for Theme Developers to extend and customize Gutenberg
  • The Modern JS Approach of using ES6+, JSX, React, webpack and more

Since Gutenberg is still in development, the course will receive updates as Gutenberg evolves.

Course Outline [38 Videos, 2 Articles]

01 – Core Gutenberg Architecture [11 videos]

  • 01.01 – A Walk Through of Core Gutenberg Files [3:18]
  • 01.02 – Main Gutenberg Plugin File [2:37]
  • 01.03 – /element – Element Library [4:03]
  • 01.04 – /blocks – The Blocks Library [3:21]
  • 01.05 – /component – The Components Library [2:31]
  • 01.06 – /editor – The Editor Library [4:03]
  • 01.07 – /data – Data Library [2:03]
  • 01.08 – /date – Date Library [1:32]
  • 01.09 – /i18n – Client Side Internationalization Library [2:12]
  • 01.10 – /docs – Docs Library [1:54]
  • 01.11 – Tooling and Configuration Files [4:53]

02 – A High Level Overview of Blocks [5 videos]

  • 02.01 – Important JavaScript Libraries that Ship with Gutenberg [4:00]
  • 02.02 – Do Custom Blocks Belong in Plugins or Themes? [1:40]
  • 02.03 – The Modern JS vs ES5 Approach [6:47]
  • 02.04 – Basic Block Architecture [6:15]
  • 02.05 – Enqueuing Block JS and CSS [7:05]

03 – Working with registerBlockType 9 topics

  • 03.01 – An Overview of registerBlockType [7:00]
  • 03.02 – registerBlockType – Title Setting [3:29]
  • 03.03 – registerBlockType – Category Setting [1:51]
  • 03.04 – registerBlockType – Icon Setting [4:39]
  • 03.05 – registerBlockType – Keywords Setting [04:06]
  • 03.06 – registerBlockType – Supports Setting [3:32]
  • 03.07 – registerBlockType – Attribute Settings [7:51]
  • 03.08 – registerBlockType – Edit Setting [6:00]
  • 03.09 – registerBlockType – Save Setting [3:32]

04 – Example Block Walkthroughs [13 videos]

  • 04.01 – Getting Setup with the Example Plugin Files [15:19]
  • 04.02 – Example – Static Block [11:27]
  • 04.03 – Example – RichText Block [11:34]
  • 04.04 – Example – Text Alignment Toolbar [8:27]
  • 04.05 – Example – Block Alignment Toolbar [6:16]
  • 04.06 – Example – Custom Toolbars in Blocks [9:37]
  • 04.07 – Example – Inspector Controls [8:48]
  • 04.08 – Example – Inspector Control Fields [19:47]
  • 04.09 – Example – Block Form Fields [8:20]
  • 04.10 – Example – Media Upload Button [11:54]
  • 04.11 – Example – URL Input [8:22]
  • 04.12 – Example – Dynamic Block [13:45]
  • 04.13 – Example – Meta Box [9:52]

05 – Addendums [2 articles]

  • Block Templates
  • Custom Block Color Schemes

The Gutenberg Development Course from Zac Gordon

Get The “Gutenberg Development” Course

$79 – Get the Course

Payment for and access to this course will take place at javascriptforwp.com.

Please Share!

Learn the future of WordPress Development with the #Gutenberg Development Course from @zgordon Click To Tweet

What Folks Have to Say

Zac Gordon - Gutenberg DevelopmentAbout Zac Gordon

Zac Gordon is a professional educator with a current focus on JavaScript development with WordPress.  Zac has years of experience teaching at and developing curriculum for high schools, colleges, bootcamps and online learning sites like Treehouse, Udemy and Frontend Masters.  In addition to teaching, Zac also runs Web Hosting for Students, one of the world’s largest hosting companies dedicated to students and teachers.

Need a Gutenberg course for non-developers? Check out Joe’s Introduction to Gutenberg Course!