Exploring Different Kinds of Gutenberg Blocks
Listen now
Description
Continuing where they left off, Aurooba and Brian recap their experience with ACF Blocks. Next, they look at two different ways to create native WordPress blocks: using nested inner blocks and using React components. They discuss the pros and cons of all three methods, how to plan your blocks, and when to just use block patterns. A full transcript of the episode is available on the website. Watch the video podcast on YouTube and subscribe to our channel and newsletter to hear about episodes (and more) first! The code from the episode - https://github.com/viewSourcePodcast/viewSource-blocks Brian + ACF Team – https://twitter.com/briancoords/status/1620442914110447619  Brian’s ACF Blog Post - https://www.briancoords.com/documentation-for-dummies-like-me/ Brian's website – https://www.briancoords.com Aurooba's website – https://aurooba.com (00:00) - Part 2: ACF Blocks vs Native Blocks (00:12) - Introduction and ACF's documentation (03:02) - Reviewing Aurooba's ACF block (05:55) - Estimated timeframe for different types of blocks (06:58) - A native block with innerBlocks (09:57) - The native block with React components (13:08) - Inner blocks versus block patterns (17:08) - The code behind the " wrapper" block (19:47) - Deciding which type of block to build (21:37) - Building a block with React components (24:52) - Matching the block editor's UI (28:21) - Wrap up - how to decide?
More Episodes
Aurooba and Brian dig deeper into the WordPress Interactivity API. This episode mostly focuses on the HTML directives they used in their custom blocks, how they work with block markup, and how the Interactivity API uses them to hydrate data. Along the way they also compare it to other templating...
Published 04/29/24
Published 04/29/24
So begins another project! This time back inside WordPress. Brian and Aurooba discuss the Interactivity API in WordPress. They explore how to use the API, the challenges they faced, and the benefits it provides. They also touch on JavaScript modules and how they are used in the context of the...
Published 04/15/24