Эффекты в React

Прежде чем рассмотреть применение хука useEffect, нам необходимо понять, что же такое эффекты в React.

Эффекты или побочные эффекты (side effects) - это дополнительные действия, позволяющие компоненту подключаться и синхронизироваться с внешними системами.

Под внешними системами подразумеваются те кусочки кода или приложения, которые не подконтрольны React. Здесь подразумевается работа с сетью, DOM браузера, анимацией, виджетами, написанными с использованием сторонних UI библиотек, и другими приложениями, созданными не на React.

Эффекты позволяют запускать код после рендеринга, давая таким образом возможность синхронизировать ваш компонент с такими системами за пределами React.

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

Нужно помнить, что эффекты - это своего рода "аварийный" люк из React, не стоит ими злоупотреблять.