Node Graph App Builder in Bubble.is!

This is a functional node graph editor I’m working on that automatically syncs the data with bubble!

It’s going to be for a no-code visual app designer using the Jasonette framework and generating the json data from the nodes and converting it into jasonette formatted json so it can be made into a 100% native cross platform functional application!

Jasonette Framework: https://jasonette.com

Checkout a video demo here: App Builder | Jasonette Designer.webm - Google Drive

8 Likes

That’s pretty neat. How are you styling the components?

I’ll be creating a property bar on the left as each node is clicked bubble will know what node is clicked and show the correct property bar for filling out style and required attributes.

It’s based off of Rete.js and just a html iframe and api call inside the iframe to send the data to a bubble endpoint

That’s smart! I tinkered with Jasonette a couple years ago. It looks like Ethan isn’t supporting it anymore, or at least the Github appears to have slowed down tremendously. Have you released anything using it before?

Not yet but I use Jasonette for fun quite a bit and know how to develop apps using it, I’m going to mainly offer this service as an SaaS however I’m gonna try and find some people to help develop this and maintain it with me as a partnership, the framework still works and the documentation is very detailed to help with maintaining it.

2 Likes

There’s now another ‘rescue’ support called jasonelle.com
Sadly, something happened to Ethan. Good initiative @battlexgenerations , 2019 will be awesome :slight_smile:

1 Like

yeah I heard about jasonelle.com, having problems atm but looking into fixing it atm

1 Like

Update: Finally managed to create a fully dynamic node graph editor that uses a boilerplate style system to create the nodes and adds it onto the editor. This allows for this new app to have a plugin system where people will be able to create custom jasonette plugins to use with this visual editor. It also has an automatic saving feature that saves the node graph data for each app built on my upcoming service :slight_smile:, Only worked on creating the node editor side of things and also the UI nodes, still need to work on the conversion of the nodes to jasonette syntax as well as implementing jasonette actions as nodes

6 Likes

Nice :slight_smile: Great work!

The node graph editor was fairly easy to create, I can offer you a tutorial on how to set it up, PM me :slight_smile:

How far is your project?

I’m also very interested in this… just dropped you a PM :slight_smile:

I’ve not done much on this project as far as implementing the logic generation part for a node graph editor mainly because I couldn’t think of a suitable algorithm for traversing through the JSON structure of the nodes that Rete.js provides as its a quite complex structure

I’ve read it and replying now

Me too! Would love to know a way to build out node based systems.

So I have built out a Node Graph API that’s fully customisable using url parameters and you can embed it onto your bubble site really easily, if you’re interested, PM me then I can set you up with a licence key to use it on your site for a small monthly fee :slight_smile:

2 Likes

For some reason I can’t send PMs (probably too new around here). But I’m very interested as well.