
Как билдер форм всех спас)
В это воскресенье прошёл наш первый воркшоп "Создание форм билдера" в сообществе.
Где я показал самый простой и эффективный способ создания этой базовой инфраструктурной штуки. (Такие воркшопы, но по разным темам, будут проходить где-то раз в неделю)
А выбрал я эту тему для начала по банальной причине: эта штука может сэкономить месяцы разработки
Вот одна показательная история из моего опыта:
Нужно было сделать вот такой билдер процессов, как на картинке. Что важно: это была подработка, и я не мог потратить на него слишком много времени.
Если сделать карту мне помогла библа (https://github.com/projectstorm/react-diagrams). Кстати, не советую её брать — крайне сложная, хотя и гибкая шо пипец
То вот с формами, которые окрываются по клику на каждый блок, встала большая проблема.
Их должно было быть 40+ разных штук.
Меня вообще не впирало сидеть и делать 40 форм. Плюс я понимал, что эти блоки — точка расширения. И если делать руками формы, то меня будут трясти по этому проекту всю жизнь.
И, проанализировав формы, оказалось, что среди них повторяются всего где-то 7 полей.
(Текстовые поля, селекты с поиском, редактор условий, массив с другими полями и еще несколько)
В общем, я решил сделать, чтобы конфиг форм приходил с бека, а я подготовлю всего 7 полей и уйду в туман.
После часов 40 разработки на mui — билдер был готов. Я сделал в storybook, показал бекеру всё и пошёл отдыхать
При визуально большой сложности, проект я разработал достаточно быстро. На самом деле, заказчик прифигел от того, как всё неожиданно дешево повернулось.
Более того, проект, хоть им активно и пользовались, не требовал правок на фронте где-то год!!!
Бекеры просто копипастили конфиги форм и вносили небольшие правки.
В моём опыте были ещё случаи, когда простое решение — создать билдер, экономило тонну времени, но это самый показательный пример
(Если вам интересны такие штуки — залетайте в сообщество. Через неделю мы проведём вторую часть воркшопа, где подключим форму к беку, обработаем серверные и клиентские ошибки, добавим селект с автокомплитом)
👉🏻 Подробнее о сообществе
В это воскресенье прошёл наш первый воркшоп "Создание форм билдера" в сообществе.
Где я показал самый простой и эффективный способ создания этой базовой инфраструктурной штуки. (Такие воркшопы, но по разным темам, будут проходить где-то раз в неделю)
А выбрал я эту тему для начала по банальной причине: эта штука может сэкономить месяцы разработки
Вот одна показательная история из моего опыта:
Нужно было сделать вот такой билдер процессов, как на картинке. Что важно: это была подработка, и я не мог потратить на него слишком много времени.
Если сделать карту мне помогла библа (https://github.com/projectstorm/react-diagrams). Кстати, не советую её брать — крайне сложная, хотя и гибкая шо пипец
То вот с формами, которые окрываются по клику на каждый блок, встала большая проблема.
Их должно было быть 40+ разных штук.
Меня вообще не впирало сидеть и делать 40 форм. Плюс я понимал, что эти блоки — точка расширения. И если делать руками формы, то меня будут трясти по этому проекту всю жизнь.
И, проанализировав формы, оказалось, что среди них повторяются всего где-то 7 полей.
(Текстовые поля, селекты с поиском, редактор условий, массив с другими полями и еще несколько)
В общем, я решил сделать, чтобы конфиг форм приходил с бека, а я подготовлю всего 7 полей и уйду в туман.
После часов 40 разработки на mui — билдер был готов. Я сделал в storybook, показал бекеру всё и пошёл отдыхать
При визуально большой сложности, проект я разработал достаточно быстро. На самом деле, заказчик прифигел от того, как всё неожиданно дешево повернулось.
Более того, проект, хоть им активно и пользовались, не требовал правок на фронте где-то год!!!
Бекеры просто копипастили конфиги форм и вносили небольшие правки.
В моём опыте были ещё случаи, когда простое решение — создать билдер, экономило тонну времени, но это самый показательный пример
(Если вам интересны такие штуки — залетайте в сообщество. Через неделю мы проведём вторую часть воркшопа, где подключим форму к беку, обработаем серверные и клиентские ошибки, добавим селект с автокомплитом)
👉🏻 Подробнее о сообществе