Помните, как родители заставляли вас играть на фортепиано или учить стихи?.. Так вот, Абстрактные классы также как и многие родители вовсе и знать не знают зачем ребенку-потомку это будет нужно, и как он это будет использовать, но уверены, что так НАДО! Т.е. такие классы содержат абстрактные методы, которые являют собой объявление метода без самой реализации, как фантик без конфетки, тем самым обязывая потомка, этот метод реализовать. Как и в жизни, где родители нередко перекладывают на детей свои нереализованные мечты…

Вот в такой шутливо-серьезной форме, мы затронули тему абстрактных классов и семейных отношений, как способ понять… и то и другое?.. А если серьезно, то разумеется, в программировании не должно быть случайных методов, и любые методы и свойства являются частью продуманной иерархии классов, которая как генеалогическое дерево, может давать возможности расширять функционал от поколения к поколению. А абстрактные классы, и еще более абстрактные – интерфейсы ( interface — вообще не содержит реализаций ), помогают программисту не потерять, не забыть реализовать общие необходимые для всех потомков умения в жизни, без которых особь умрет, а с ней и приложение.

Источник : habrahabr.ru

Abstract classes in JavaScript

golentor спасибо за ответ. В свободное время для личных проектов пишу фронт, Vue стараюсь активно использовать, куда ж без него)

Если по текущему статусу решения вопроса, то пока вырисовывается так:

• После некоторого ресерча оказалось что не совсем понимал работу JS с DOM.
  
• Также для большей свободы и контроля, решил перейти с стандартного dragndrop на свой, основанный на mouseevents (https://learn.javascript.ru/mouse-drag-and-drop).
  
• С сеткой тоже все оказалось проще, CSS разлиновал сетку по точкам, а когда отпускаю блок (mouseup) высчитываю ближайшее расстояние до точки и двигаю его туда. Так что обошлось без лишних библиотек.
  
• Данные буду хранить в атрибутах, перебирать элементы (над этим еще надо подумать) и сохранять в один из форматов.
  

В общем потихоньку решил накидать основу на Vanilla и мигрировать на Vue используя компоненты.
Насчет graphQL спасибо, почитаю. А готовые решения боюсь не подойдут, много переделывать под себя.

Сейчас один из вопросов который возник, перемещение нескольких добавленных элементов, когда между ними добавляют элемент. Или при добавлении нескольких ветвей (if-else-...) у нас визуально растет дерево, и если такие сложные условия будут на нижних уровнях, они будут двигать все элементы дерева сверху. В общем не знаю еще как это решать, может есть идеи?) Насчет вместе покодить я не против общего репо)

P.S наверное насчет вопроса поторопился, надо хотя бы приступить к этой проблеме и задавать более конструктивные вопросы)