​​📌🧐3 самых распространённых ошибок среди React разработчиков.

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

1. Не создают достаточно компонентов.
Разработчики React часто допускают одну ошибку: они не создают достаточно компонентов. Как правило, есть два способа написания приложений: собрать все в одном месте (монолит) или разбить все на более мелкие части (микросервисы).
По замыслу приложения React должны быть составными.
Таким образом, мы можем создавать различные наборы компонентов, которые — вместе взятые — составляют всю страницу.
Этот метод не только экономит ваше время, но и избавляет от стресса при отладке, поскольку вы сразу определяете, какой компонент связан с каждой ошибкой.

2. Написание логики в компонентах.
При поиске правильного способа создания компонентов для повторного использования шаблон создания компонентов представления и контейнера часто является одним из первых.
Компоненты представления связаны с тем, как все выглядит, в то время как компоненты контейнера связаны с тем, как все работает.
Распространенная ошибка в приложениях React заключается в том, что разметка презентации и логика приложения объединены в один компонент.
Недостатком этого подхода является то, что вы не можете легко повторно использовать любые компоненты или логику без копирования и вставки.

3. Не используют абсолютные пути
Если вы когда-либо работали над приложением React, содержащим много компонентов, изображений, CSS-файлов и других файлов, вы согласитесь, что импорт файлов из разных каталогов может быть утомительным. Много раз мы будем импортировать файлы следующим образом:
../../../importone.js
../../../importtwo.js
Мы уже можем видеть, что это не аккуратно, и изменение каталога файла приведет к сбою импорта. С выходом Create React App 3 теперь мы можем использовать абсолютные пути импорта. Для этого создайте в корневом каталоге файл jsconfig.json со следующим содержимым:
// jsconfig.json
{
  "compilerOptions": {
    "baseUrl": "src"
  },
  "include": ["src"]
}
Теперь вы можете импортировать файлы следующим образом:
import React from 'react';
import { LINKS } from 'helpers/constants';
import Button from 'components/Button/Button';

Заметьте что это всего лишь малая часть ошибок, но эти являются самыми распрастранёнными среди React разработчиков.