Какие материалы надо изучить для создания HTML BUILDER`а?

Question

[Владимир Меркулов]

Всем доброго времени суток!

Есть вот такая прикольная штука builder.chillyorange.com/demo

Работает на JS и Canvas

У меня вопрос такой, какой материал мне нужно найти и изучить что бы сделать подобное?

Возможно есть уже готовые туториалы где идет объяснение как работать с drag and drop и созданием html элементов в области canvas`а?

Comments

[Владимир Меркулов]

Я признателен за замечние =) но все же хотелось бы увидеть ряд ссылок и пендалей в нужную сторону =) ибо сам я находил уроки которые объясняли принцип drag and drop для рисования и подобных действий, но не для определения элемента и последующего его создания на основе шаблона выбранного компонента.

[Владимир Меркулов]

У меня было предположение, что можно покапать в сторону jQuery работа с drag and drop и определением области в которую помещается перетаскиваемый объект, но не уверен правильный ли это путь изучения.

Answer 1

[yernende]

Нет там canvas, там чисто с DOM работа идет. Туториалы по drag&drop гуглятся на раз - learn.javascript.ru/drag-and-drop

Comments

[Владимир Меркулов]

Спасибо, видимо из-за простуды мой скил гугления понизился до состояния нуба ))) хороший пример для изучения!

Answer 2

[deleted-tnorman]

Качественное создание подобного конструктора требует всех тех навыков и умений, обладание которыми позволит вам называть себя "middle frontend developer".

Чтоб уточнить, что конкретно вам стоит изучать воспользуйтесь одной из бесчисленного числа бирж труда и задайте поиск по профессии "middle frontend developer", у большинства подобных вакансий есть список требований (на подобие такого )

Необходимые навыки
- 2 or more years’ experience in architecting, designing and developing JavaScript applications
- Strong understanding of OOP principles
- Strong experience with HTML, CSS and Javascript
- Solid expertise of UI/UX design methodologies and standards
- Experience with REST API / JSON
- Experience with common JS Frameworks (AngularJS, BackboneJS)
- Cross-browser development
- At least UX with mobile devices (iPad)

Добавьте сюда навыки работы с серверной частью (к примеру PHP + MySQL) и получите перечень необходимых навыков.

Answer 3

[_ _]

Если там написано BUILD YOUR PAGE BY DRAGGING ELEMENTS ONTO THE CANVAS, это еще не значит, что там используется Canvas технология.