Building Interactive Blocks workshop

Welcome to the GitHub repository of the WordCamp Europe 2023 workshop, Building Interactive blocks by Luis Herranz.

In this workshop, we'll learn how to create interactive blocks using the Interactivity API.

Preparation steps 🧑‍🍳

1. Download Node

   Not necessary if you have Node >= 16.

2. Clone this repository, or download it

   Cloning is recommended, but downloading is also fine.

3. Run npm install

   This may take a while, so do it as soon as you get the repository.

4. Download the "Gutenberg ❤️ Interactivity API" plugin

That's it! You don't need to install anything or do anything else just yet.

Time to code! 🧑‍💻

Hey, wait until it's time to code… 🤫

Is time to code? Ok, let's go!

Start the project 🚀

1. Run npm start
2. Go to localhost:8881
3. Install the "Gutenberg ❤️ Interactivity" plugin

That's it 💥

How to follow the workshop 🧐

The workshop is divided in steps.

You can…

1. Write all the code

   Not recommended unless you are already familiar with the Interactivity API.

2. Copy and paste the code snippets of each step from here

   Only recommended if you are familiar with block development.

3. Use git to move through the steps

   The easiest one! Good to follow along even if you're not familiar with block development.

   To move through the steps, you can use this command:

   • git checkout step0
   • git checkout step1
   • ...

Important: you can see the changes of each step here.

Get involved! 🦸

The Interactivity API is an initiative in progress. Got questions or feedback about it? We'd love to hear from you in the GitHub Discussions.

Are you interested on contributing with code or documentation? Come to the repository!

You can also find me in Twitter, GitHub, or Slack (always as @luisherranz).