Improvements to Modelina playground

[jonaslagoni]

Reason/Context

We should create a more coherent playground that wraps the playful nature as well as being the main place to try out different setups with Modelina.

There are so many different improvements we can do so I am just gonna list a bunch that came to mind:

• Sharing modeling setup through queries, i.e. one could give you the link modelina?generator=typescript&input=A4Gabuqwj... and automatically set the corresponding generator options, as well as input.
• Download models directly from the playground, so you don't have to use the (upcoming) CLI to do it.
• Modelina does not only support AsyncAPI as input, but multiple others, so we should allow such input in the playground.
• Improve UX for how to show the generated models cause if Modelina generates more than 5, it becomes chaotic.
• Make it easier for people to start using the playground, by "showing" people around the UI.
• Same as Studio, I think it makes sense to have a template kind of setup to quickly play around with different setups.
  

Can you think of anything else we can do to the Modelina playground to improve it?

[ron-debajyoti]

This sounds really interesting. I think I want to take this proposal as my project.

[darp99]

This sounds interesting. I would like to work on this as part of mentorship program

[ayushpaharia]

Hey @jonaslagoni -

I'm an experienced full-stack engineer and also have relevant experience in UI and UX. I'm interested in working on this project in the mentorship program.

Ideas

1 - Sharing modeling setup through queries can be implemented with work on backend APIs to queries. As in the generated code would be saved somewhere. Which can be populated onto someone who visits a specific URL.

2 - Download models directly from the playground - Can you elaborate on this issue?

3 - Improve UX for how to show the generated models - Appropriate Design files and UX could be designed to handler more than 5 generated models

4 - Easy startup with the help of playgrounds - Simple templates could be implemented (Point-1), with some specific URL modelina?generator=typescript_starter&input=A4Gabuqwj...

[ron-debajyoti]

Hi @jonaslagoni!

As mentioned earlier, I definitely want to finalize working on this project.

I'll be implementing the ideas mentioned based on the following priority order :

1. Modelina does not only support AsyncAPI as input, but multiple others : I feel that this should be the top priority because right now Modelina has evolved much more than just supporting AsyncAPI specs and rn supports JSON, OpenAPI, and introductory TypeScript files. (2 weeks)

2. Same as Studio, I think it makes sense to have a template kind of setup. :

   • This is an extension of the above feature. We have the example templates of the different specs and use it just like in Studio.
   • We also have to update the different new presets we support in the playground. (2-3 weeks)

3. Sharing modeling setup through queries : (2 weeks)

4. Download models directly from the playground. :

   • In addition to downloading the models, we should also try to add the support of uploading the spec files into the playground, instead of copy-pasting the contents of the file. Possibly have a small dropzone, and after getting the document, we work on it in the playground to generate our models. (2 weeks)

5. Improve UX for how to show the generated models cause if Modelina generates more than 5, it becomes chaotic. : Possibly explore to improve the web performance of the playground plugin of the asyncapi website. (2-3 weeks max)

Total estimate time : 12 weeks max.

I might add new improvements and features along the way 😄

[jonaslagoni]

As this issue was not chosen as part of the AsyncAPI mentoring program, everyone is welcome to work on this, and if you want mentoring in any way just ping me 🙂

[ron-debajyoti]

As this issue was not chosen as part of the AsyncAPI mentoring program, everyone is welcome to work on this, and if you want mentoring in any way just ping me slightly_smiling_face

I'll try to work on this project on weekends but it's gonna take a while again. Apologize for the delay.

[github-actions]

This issue has been automatically marked as stale because it has not had recent activity 😴

It will be closed in 120 days if no further activity occurs. To unstale this issue, add a comment with a detailed explanation.

There can be many reasons why some specific issue has no activity. The most probable cause is lack of time, not lack of interest. AsyncAPI Initiative is a Linux Foundation project not owned by a single for-profit company. It is a community-driven initiative ruled under open governance model.

Let us figure out together how to push this issue forward. Connect with us through one of many communication channels we established here.

Thank you for your patience ❤️