Help! I’m Behind on Gutenberg!
WordCamp Lancaster 2019
Are you?
Gutenberg will be 5 months old on May 6th.
Expected behavior of a 5 month old:
- does not understand object permanence
- grasping objects with both hands
- babbling noises
- rolls over - maybe
- sits unsupported - maybe
- might sleep through the night
Be nice to yourself.
You still have the opportunity to grow with Gutenberg.
Photo by BunnyJ at Morguefile.com
That said...
Photo by Koan at Morguefile.com
Photo by thesuccess at Morguefile.com
Photo by Luis Miguel Bugallo Sánchez (Lmbuga) at Wikimedia Commons
What is Gutenberg?
The Gutenberg project's original goal:
The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTML, or “mystery meat” embed discovery.
It is a new editor experience.
New Concept: Blocks
With blocks, you can insert, rearrange, and style multimedia content with very little technical knowledge. Instead of using custom code, you can add a block and focus on your content.
New Concept: Block Categories
New Concept: Reusable Block
New Concept: Block Templates
Empowerment of Users
Without being an expert developer, you can build your own custom posts and pages.
Modern Experience for Developers
Built with modern technology.
Designed for compatibility.
If you need a reminder of why we're doing this...
Watch the user testing section of Matt Mullenweg's State of the Word 2018.
Start watching at time stamp 3:40.
How can such a vision happen without dismantling, rebuilding, fragmenting, or breaking the WordPress ship that for over a decade has been carrying the thoughts, joys, and livelihoods of millions of people and more than a quarter of the web?
Matias Ventura, Gutenberg, or the Ship of Theseus, October 9, 2017
...Many of us will have to learn something new, but we’ll be embracing the next generation of the web [...] we’ll be drastically elevating what’s possible in WordPress. If we believe in this future, our job then becomes to start this process as soon as we can, write documentation and tutorials, and provide good migration paths.
Joen Asmussen, Learn Something Difficult, July 25, 2019
How can we learn difficult things?
Feynman Technique
- Identify a concept
- Explain the concept
- Study the gaps
- Simplify explanation of the concept
Note: repeat steps 2 and 3 until understanding has sunk in.
More on this from Mat Ford.
What do you need to know?
Content Managers
Content Managers
Figure out what the new parts of the interface are.
Content Managers
Learn how to move blocks around and access their settings.
Content Managers
Familiarize with the standard blocks and their capabilities.
Content Managers
Start looking at plugins that might fill in gaps in the blocks you need.
Content Managers
Figure out what the impact is on plugins you already use.
Content Managers
Don't experiment live.
Content Managers
Read the support documentation on the editor.
Content Managers
Resource for training on the editor:
Go Gutenberg.
Project managers
Project Managers
Learn how to use the new editor.
Project Managers
Learn how to explain what Gutenberg is and is not.
Project Managers
Learn about how an existing site can be made "Gutenberg-Compatible".
Project Managers
Experiment with estimates and new ways of defining scope.
Project Managers
Read about Gutenberg regularly, e.g. on WPTavern
Designers
Designers
Figure out how component-based design fits in with Gutenberg.
Designers
Learn how Gutenberg templates correspond to design patterns.
Designers
Learn about Gutenberg custom color palettes.
Designers
Review the Designer Documentation section of the Gutenberg Handbook.
Developers
Developers
Gutenberg was developed on GitHub using the WordPress REST API, JavaScript, and React.
Developers
Learn how to build and style a custom block.
Developers
Learn how to migrate existing features to blocks and/or backward compatibility.
Developers
Learn how to make block templates.
Developers
Learn how to modernize themes to make them Gutenberg-friendly.
Developers
Figure out what to do with shortcodes, meta-boxes, and Custom Post Types.
Developers
Learn how Gutenberg stores data.
Developers
Learn about internationalization practices for Gutenberg.
Developers
Read up on Gutenberg and accessibility.
Developers
Learn as much JavaScript as you need to.
A Case Study: Me
Blossom n Bloom Photography
Photo by diannehope at Morguefile.com
Public domain image from Alexandria (Va.). Office Of City Engineer, Wikimedia Commons
Photo by @getshifter on Twitter
Photo by Erean at Morguefile.com
Photo by thelesleyshow at Morguefile.com
Public domain image from Anatomy of the Human Body by Henry Gray, Wikimedia Commons
My Plan
Resume attending WordCamps.
Watch Gutenberg Talks on WordPress.tv
Give this talk.
Attend the Gutenberg sessions today:
- 11:00AM, Developing Blocks Without React by Ashley Eberly
- 1:00PM, Block Filters: The Answer to Customizing Blocks Without Rolling Your Own by Paul Barthmaier
- 1:35PM, Styling Blocks for the Backend by Erik Teichmann
Prepare existing sites for WordPress 5.0 with the Classic Editor Plugin
Develop process for testing Gutenberg on existing sites.
Build my first Gutenberg-capable site with a safe client.
Modernize my base theme using the Gutenberg Starter Theme
Make time to study deeply.
Ignore learning more about CSS Grid and Flexbox for a bit.
Read the Gutenberg handbook!
Read the core P2 stuff about the editor backwards.
Go back and read what people wrote.
- 10/9/2017: Gutenberg, or the Ship of Theseus, Matias Ventura
- 7/24/2018: A Few Use Cases I Would Like To See Solved In Gutenberg, Aaron Jorbin
- 12/29/2017: Gutenberg Inspired Redesign, Tammie Lister
- 1/4/2018: Random Thoughts on Six Months of Using Gutenberg, Aaron Jorbin
- 2/7/2018: Gutenberg and Themes, Joen Asmussen
- 8/1/2018: Gutenberg Design Basics, Tammie Lister
- 10/18/2019: Some Gutenberg Accessibility Clarifications, Joe Dolson
- 11/29/2018: A Gutenberg FAQ, Matt Mullenweg
- 11/30/2018: Designing a Gutenberg Block, Mel Choyce
- 1/8/2019: Gutenberg Navigation Block Concepts Roundup, Mel Choyce
Go through the Gutenberg Courses from Zac Gordon and Joe Casabona.
Explore Core.
Lurk in Slack.
Specifically the #core-editor channel: WordPress core editor development and design. Weekly meetings held Wednesdays at 13:00 UTC.
Also the #core channel: WordPress core development. New Contributor meetings on the 2nd and 4th Wednesdays at 19:00 UTC.