Воркшоп по разработке билдера форм

Представляю наиболее простой и действенный метод создания этой важной инфраструктурной единицы. Я выбрал эту тему в первую очередь потому, что она способна значительно сократить время разработки — речи о нескольких месяцах.

Поделюсь одной историей из моего опыта:

Требовалось разработать билдер процессов. Важно отметить, что эта задача была подработкой, и у меня не было возможности тратить на нее много времени.

Создать карту мне помогла библиотека (https://github.com/projectstorm/react-diagrams). Хотя я ее не рекомендую из-за сложности, она достаточно гибкая.

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

Таких форм должно было быть более 40. Мне совершенно не хотелось вручную создавать так много форм. К тому же я осознавал, что эти блоки будут точкой расширения. Если делать формы вручную, меня будут привлекать к этому проекту бесконечно.

Проанализировав формы, выяснилось, что в них есть всего около 7 повторяющихся полей.

(Текстовые поля, селекты с поиском, редактор условий, массив с другими полями и еще несколько)

В итоге я решил, чтобы конфигурация форм приходила с бэка, а я подготовлю всего 7 типовых полей. После приблизительно 40 часов разработки на MUI билдер был готов. Я задокументировал все в Storybook, показал бек-энд разработчику и отправился отдыхать.

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

Более того, хотя проект активно использовался, он не требовал правок на фронте около года!

Бек-энд разработчики просто копировали и вносили небольшие изменения в конфиги форм.

В моей практике было еще несколько примеров, когда аналогичное простое решение — создать билдер — экономило массу времени. Но это самый наглядный случай.