Портфолио, проекты и кейсы Creative

Функциональное программирование на ReactJS




Стандартизация написания компонентов или как не бояться legacy-кода в больших и длинных проектах



Срок реализации – от 2х недель.


Задача


Упростить поддержку legacy-кода в больших проектах


Стэк


React


Решение

Legacy - новые возможности в старом коде


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

Условно, компонент занимал 300-400 строчек кода. Состоял он из классовых компонентов, описания жизненных циклов, и прочего. Если новая задача требует внедрить в него какую-то новую фичу, то наши программисты теперь переписывают его на функциональные компоненты, задействуя hook’и и лаконичный синтаксис (callback’и и стрелочные функции). В результате от всего многообразия описания состояний остается всего 100-150 строчек. Вероятность допущения ошибки снижается, код становится читабельнее.

С точки зрения бизнеса в ходе такого рефакторинга происходит оптимизация затрат клиента - дальнейшая поддержка и внедрение нового функционала упрощается, разработчики тратят меньше часов и денег клиента. В то же время, подкапотная магия hook’ов и функциональщины подразумевает более высокий скилл программистов. Многие use-эффекты и их отработку в разных условиях приходится держать в голове.

Frontend JavaScript ReactJS FinTech