AsyncAPI Blocks

[AceTheCreator]

What is AsyncAPI Blocks?

---

AsyncAPI Blocks is a no-code tool that can be used to define your specifications and get a real-time preview of what your spec looks like by simply dragging and dropping different types of blocks. The inspiration behind the AsyncAPI Blocks is Scratch and it's guided by the ability to easily create and maintain specifications. This makes it easy for newbies to confidently jump into any sophisticated specification file and start maintaining it like a pro.

Implementation Flow

---

The AsyncAPI Blocks Implementation was made possible thanks to the Blockly project that made it possible and flexible to create blocks and turn them into code.

The current implementation is divided into 3 parts which are all visible in the UI

• The Schema selector
• The Toolbox
• The Playground
• The Preview mode

The schema selector

---

The schema selector is the central part of the UI that gives you the ability to select the type of schema you want to implement. Here's what it looks like

The Toolbox

---

The toolbox is the panel that appears at the left-most side of the UI which will appear once either one of the schemas has been selected or a block is been selected. This toolbox contains the type of blocks available for a particular schema/block

The Playground

---

The playground is where all blocks will be implemented

The Preview Mode

---

The preview mode is where the spec generated from all the blocks above will be available for view(Read-only for now)

Demo Clip

---

Untitled.1.mp4

What's Next

---

• Block validations
• Multiple playgrounds
• Data persistence to local storage
• Turn code to blocks
• Integrate with AsyncAPI studio
• Block styling functionality

Future Works

---

• Ability to support any type of specifications
• Make a standalone version
• Real-time collaboration
• A library for blocks (This gives the ability to share your file with people publicly)

Project Links

---

• Playground link ⇒ https://asyncapi-blocks.netlify.app/
• Repo's Link ⇒ https://github.com/AceTheCreator/asyncAPI-blocks

[samoye01]

Great!

[Ripplz]

This is lit lit! I always love me a Scratch-inspired project... well done and good luck Ace!🔥🚀

[Folukie]

Awesome Project!

[ExcellentSoft]

You did well, Keep it Up

[mcturco]

This is a great tool that I see working nicely in the AsyncAPI Studio! Would love to collaborate with you on user experience and interface design things if that interests you!

[AceTheCreator]

That would be super awesome... Looking forward to collaborating with you 😊