I'm starting to learn Gutenberg blocks.

I want to create a Gutenberg "track" block as part of a larger music "app" i'm working on.

The whole app will rely on a standard named JSPF, which is a JSON object crafted to define a playlist and its tracks.

So a basic JSPF track looks like this:

{
  "title"         : "Track title",
  "creator"       : "Artist name",
  "album"         : "Album name"
}

I want to build a Gutenberg "track" block that could deal with such an object.
When editing a block, I don't want it to store the HTML that will be rendered, I just want to store the JSPF track object.

For instance, the Gutenberg video block stores data like this

<!-- wp:video -->
<figure class="wp-block-video"><video controls src=".mp4"></video></figure>
<!-- /wp:video -->

I don't need to store the HTML output like that block. I just need to store the JSON object and will use a javascript (React) component when I need to display it.

How should I tacke this ?

Thanks a lot !