Skip to main content

How do drag and drop builders work?

Rails • Asked by josh edgar

So many website builders, form builders etc are comming to market. How do these actually work and is it possible to build something like this in rails?

I'm assuming you drag an element onto a canvas using jquery or something but does it then populate a hidden form or set variables?!? could probably hack my way through to a working project but would love to know the best practice?


I'm not sure how most of them work, but generally you can just keep the data in Javascript and then submit it over to the server as JSON data when you want to save it. That way you're not dealing with hidden form fields all over the place which would get complicated fast.

The drag and drop portion could be done with any Javascript library for it. You'd probably be best off using something like Vue.js or React for this these days because it clean up a lot of the complexity there. jQuery also works really well, but it tends to lead to some spaghetti code if you don't organize it well.

While this isn't exactly the same, I'm going to be doing a series building a clone of Trello starting in a week or two which will be kind of similar.


I can point you to 2 different open source website builders, they have a starting point but unfortunetly one is made with React and one is made with Backbone Js, and I wanted something in Vue Js.

  1. Grapes Js http://grapesjs.com/
  2. Relax Cms https://github.com/relax/relax (I'm not sure if the team is still working on it or not.)

Awesome guys, thank you. It's a great start. Might have to start brushing up on my Javascript.


Login or Create An Account to join the conversation.

Subscribe to the newsletter

Join 24,647+ developers who get early access to new screencasts, articles, guides, updates, and more.

    By clicking this button, you agree to the GoRails Terms of Service and Privacy Policy.

    More of a social being? We're also on Twitter and YouTube.