Gridstack.js is a modern Typescript library designed to help developers create beautiful draggable, resizable, responsive bootstrap-friendly layouts with just a few lines of code.
You can create more advanced grids: allow users to persist changes, create a sidebar of widgets to drag into your grid, and much more.
Features:
pure JS can be used in any UI framework
mobile support
draggable, resizable items
drag'n'drop from sidebar to insert/delete
responsive layouts, column based
save/restore
drag between multiple grids
nested grids
external Angular, Vue, React, Ember, Knockout.js bindings and more
From his web
Gridstack.js is a modern Typescript library designed to help developers create beautiful draggable, resizable, responsive bootstrap-friendly layouts with just a few lines of code. You can create more advanced grids: allow users to persist changes, create a sidebar of widgets to drag into your grid, and much more.
Features:
pure JS can be used in any UI framework mobile support draggable, resizable items drag'n'drop from sidebar to insert/delete responsive layouts, column based save/restore drag between multiple grids nested grids external Angular, Vue, React, Ember, Knockout.js bindings and more
Checkout the demo. https://prnt.sc/vohq0n
You can read an implemented vue case in this article https://blog.prototypr.io/grid-layout-editor-for-vue-js-a-research-project-for-pariksha-io-e3445025d21e
And its github repo for vue-grid-layout version here https://github.com/Krutie/bugs-of-the-city