DEV Community

wolfiton
wolfiton

Posted on

The cons and pros of creating a drag and drop page builder from scratch? (React, Vue, Angular)

Hi everyone,

Would you build a drag and drop page builder from scratch or would you go with an open-source solution?

Do you have any concerns regarding the updates with an open-source solution?

How would you store the generated code in json or html? (if you build your own solution)

Thanks for any experiences you can share about implementing something like this.

Top comments (6)

Collapse
 
sarahk profile image
Sarah • Edited

To the questuon how, I've wrote a page builder in Angular using JavaScript custom elements developer.mozilla.org/en-US/docs/W...

What open-source libraries do this?

Collapse
 
wolfiton profile image
wolfiton • Edited

Hi, @sarahksiyer

Thanks for sharing your solution

To answer your question I wrote some opensource libraries that I know about, below.

A couple of options for React are:

Vue options

Angular option

Collapse
 
sarahk profile image
Sarah

Oh wow I had no idea, thank you 😅

Thread Thread
 
wolfiton profile image
wolfiton

You are welcome

Collapse
 
joezimjs profile image
JZ JavaScript Corner • Edited

Use what exists if it fits your use case. If not, at least see what you can learn from them before running out and building your own. I've often considered building my own because nothing works 100% to my saturation, but I can get by well enough that it probably isn't worth the effort.

If I created my own version, I'd store it in JSON. That makes it easier to edit and any updates to how an individual block works or what HTML it outputs will be much easier to deal with.

Collapse
 
wolfiton profile image
wolfiton

Thanks, @JZJavaScriptCorner for sharing your experience and considerations of building a Drag and drop page builder from scratch.

I really appreciate the detailed response you offered and also the thought process behind it.