Репутація українського ІТ. Пройти опитування Асоціації IT Ukraine
×Закрыть

React UI Builder: визуальный построитель React компонентов

Здравствуйте,

Представляю вашему вниманию open-source проект github.com/ipselon/react-ui-builder

Это визуальный редактор React компонентов. Устанавливается через npm, запускается на локальной машине. Есть галерея готовых проектов с компонентами (Bootstrap, Material UI, и др.), которые можно скачать и начать разрабатывать свое приложение на их основе.

Есть on-line демонстрационная версия umyproto.com/react-ui-builder.

Буду рад любого рода отзывам. Спасибо.

LinkedIn
Допустимые теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter
Допустимые теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter

Кому понравилось создавать страницы с помощью React UI Builder, посмотрите на новый проект в галерее: теперь можно прототипировать с красивыми Material UI компонентами.
helmetrex.com/Gallery.html

Приглашаю всех попробовать новую версию билдера, плюс теперь у билдера есть свой сайт helmetrex.com

Весьма интересная вещь! Молодцы!

ого, что-то нереальное, а перспективы грандиозны, только вот в 20 кликов так и не понял как этим пользоваться... у меня не получилось элементарное — добавить, отредактировать элемент...

думаю уже можно сказать то, что это реально уи тулкид / редактор, а область применения просто впечатляет.

позже подумаю посмотрю внимательней, а пока просто респект!

Здесь короткий туториал www.youtube.com/watch?v=yycaq9qv7us
Но сам инструмент умеет больше... :-)

«область применения» такого редактора, для ком. проектов и их пользователей утопия — «всегда» нужны очень индивидуальные решения. например, редакторы на сайто-хостингах, внутренние утилиты для редакторов на каких-то веб-порталах...

для разработчиков? ну как-бы тогда уже — «веб ориентированная ИДЕ», а такой билдер может вполне стать модулем этой иде...

но, на роль этой иде тянет только сам браузер... по этой причине сложно что-то предложить, прокомментировать;

возможно будет актуальным: каталог компонентов с интегрированным редактором для вендоринга/контирибюшена этих компонентов, — в каком-то смысле «кодогенирациея» думаю будет юзабельно.

только вот как «стандартизировать» код проекта, дать возможность открывать в этой «иде» и другие реактивные проекты?... пока мысли путаются:)

добавить любой React компонент в библиотеку очень легко. Нехватка времени сказывается на качестве документации (есть описание на GitHub). Билдер играет роль помощника для быстрого составления компонентов в композицию и облегчает написание кода за счет генерации. Кроме того важную роль играет галерея готовых проектов с компонентами.
Цель не стоит заменить IDE, цель стоит — облечить работу для прототипирования компонент. Хотя как сайто-строитель тоже подойдет — но нужны хорошие наборы компонент, которые собраны в проекты.

Здесь короткий туториал: как создать компонент www.youtube.com/...aq9qv7us&feature=youtu.be

Идея здоровская! Молодцы!

Спасибо! Если есть какие-то идеи высказывайте, буду рад рассмотреть любые предложения.

поверхнево подивився мануал але на демовесіі так і не вдаложся додати жоден компонент. Важко зрозуміи як тим користуватися

Не вдалося додати компонент на сторінку чи у саму бібліотеку (набір) компонентів ?

Якщо на сторінку, то ось тут це описано github.com/...able-components-into-page
Згоден, що трохи стисло, але це тому, що дуже не хватає часу.

а звідки в того будуть хоч якісь корстувачі якщо не пояснюєш як тим користуватися?
дивись, я відкриваю umyproto.com/react-ui-builder роблю Add page і бачу текст
«This is an empty page. To add new component select needed element on left-side panel and click on an element on the page where you want to put new component»

я вибрав і клікнув — результата нема, лише пише що щось лежить в кліпборді. А виявляеся що треба ще клікнути «before» на вибраному компонете щоб щось додалося

Згоден, треба поміняти текст. Дякую!

Подписаться на комментарии