+44 0330 223 3428
Call Us
+44 0330 223 3428

WPTavern: New Toolkit Simplifies the Process of Creating Gutenberg Blocks

WPTavern: New Toolkit Simplifies the Process of Creating Gutenberg Blocks

Ahmad Awais, who created the Gutenberg Boilerplate last year, has released a Guten Block Toolkit. The toolkit substantially simplifies the creation of Gutenberg Blocks by providing no configuration, one dependency, and no lock-in.

Awais created the toolkit after receiving feedback that configuring things like Webpack, React, ES 6/7/8/Next, ESLint, Babel and keeping up with their development was too difficult.

“Developers told me that they built Gutenberg blocks with ES5 because the amount of time required to configure, set up, and learn tools like Babel, Webpack, ESLint, Prettier, etc. wasn’t worth it,” Awais said.

“So, yes! I went ahead and built a solution — a zero-config-js #0CJS WordPress developers’ toolkit called create-guten-block!”

Creating blocks using the toolkit is a three-step process.

Developers begin by installing Node version 8 or higher on a local server. The next step is to run the create-guten-block command and provide a name for the plugin that will be created. This command also creates the folder structure necessary to maintain the project. The last step is to run the NPM start command which runs the plugin in development mode.

Once these steps are completed, the WordPress plugin will be compatible with Gutenberg and have React.js, ES 6/7/8/Next, and Babel, which also has ESLint configurations for code editors to detect and use automatically.

The Guten Block Toolkit comes with the following:

  • React, JSX, and ES6 syntax support.
  • Webpack dev/production build process behind the scene.
  • Language extras beyond ES6 like the object spread operator.
  • Auto-prefixed CSS, so you don’t need -webkit or other prefixes.
  • A build script to bundle JS, CSS, and images for production with source-maps.
  • Hassle-free updates for the above tools with a single dependency cgb-scripts.

The project has received positive feedback, including from members of Gutenberg’s development team.

With a stable release now available to the public, Awais is working on 2.0.0. “The next step is to get this toolkit tested and mature the entire app to release version 2.0.0 for that not only do I need your support, I ask that you hop on board and contribute — that’s the only way forward,” he said.

Create Guten Block Toolkit is MIT licensed and available for free on GitHub. Contributions are welcomed!



Source: WordPress

Related Post
WPTavern: WPTracSearch: An Elasticsearch-Powered Search Interface for WordPress Trac Tickets

WPTavern: WPTracSearch: An Elasticsearch-Powered Search Interface for WordPress Trac Tickets WordPress Trac is one of the more utilitarian and uninspiring interfaces that many contributors have to contend with in the process of giving back to the project. After growing tired of Trac’s mediocre search functionality, William Earnhardt set out to improve it with a new […]

Read more
WPTavern: Tips for Replying to A Call for Papers or A Call for Speakers

WPTavern: Tips for Replying to A Call for Papers or A Call for Speakers The following is a guest post written by Jennifer Bourn. With 21 years experience as a graphic designer, 15 years experience as a web designer, 14 years as a creative agency owner, and 11 years as a blogger, Jennifer Bourn has […]

Read more
WPTavern: Storefront 2.5.0 Introduces a Custom, Block-Based Homepage

WPTavern: Storefront 2.5.0 Introduces a Custom, Block-Based Homepage Storefront, WooCommerce’s free flagship theme, has just released version 2.5.0 with updates that make it easier to setup and customize the homepage. In 2017, WooCommerce 2.2 introduced starter content to help users set up the homepage template, menus, widgets, and add some demo products. This content has […]

Read more