Делал я недавно рефакторинг на одном из frontend проектов и в нём обнаружил огромное количество классических проблем.

🔹Безумный линтер (проверяется тип окончания строки, запрет сборки при наличии неиспользуемых переменных)
🔹Отсутствие единой библиотеки компонентов (постоянно не хватает нужных компонентов)
🔹Дублирование кода.
🔹Отсутствие единого стиля (сводит с ума, глаза страдают).
🔹Проблемы с датами (даты приходят по гринвичу, в приложении задан московский часовой пояс, нет единого формата)
🔹Плохо реализованная обёртка над fetch (недоступна отмена запроса)
🔹Кривой сборщик (проект собирается очень долго, не работает пересборка yarn)
🔹Плохо расширяемый код
🔹Файл на 1500 строк кода.
🔹Нет очистки данных при переходе на другую страницу (сначала отображаются предыдущие данные, а потом меняются на те, что пришли с сервера)

Могу поделиться на своём опыте, что самый лучший способ найти работу без опыта - это сделать собственный pet проект. И именно так было у меня. В процессе изучения, я хотел сделать что-то интересное для себя, почувствовать силы. И именно это мне помогло. Я сделал развлекательный портал, который я показывал своим потенциальным работодателям. Вспоминая тот код, могу сказать, что он был очень плохим и содержал кучу типичных ошибок. Однако, он помог мне почувствовать свои силы и найти первую работу. И хотя портала уже давно нет, память о нём ещё есть в поисковом сервисе.

Мой самая большая ошибка в карьере - это то, что я не уделял внимание английскому языку. Хотя он и не связан напрямую с моей работой, но он очень часто бывает нужен. Это и чтение документации, и просмотр в компании и работа в зарубежной компании. Хотя в последние 2 года я усиленно его практикую, всё равно полной свободы в его применении пока так и не почувствовал. Вся проблема в том, что мозг очень долго привыкает его использовать. Поэтому, как мне кажется, каждому разработчику следует начать его изучение как можно раньше.

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

Какие основные проблемы, которые привели к этому:

🔹Выбрана библиотека Yup для валидации, но она совсем не годится для серверной валидации.
🔹Конфликтуют 2 вида валидации - автоматическая клиентская и серверная.
🔹Форма очень сильно переполнена логикой
🔹Запросы с условиями в useEffect.
🔹God функции и компоненты.

Примерно год назад я узнал, что CSS Modules уже 5 лет, как не поддерживаются. То, есть, я познакомился с ними тогда, когда они уже давно были заброшены разработчиками.

И я задался вопросом, что же использовать для React приложений. К CSS, SASS, LESS возвращаться не хочется. До сих пор вспоминаю, к каким проблемам они могут привести.

Как оказалось, сейчас не заброшенными являются Styled-components и Tailwind. И тут я осознал, что всё это уже было много лет. Примерно то же самое и заложили разработчики много лет назад, когда создавали атрибут style. Хоть и не аналог, но подход очень близок. Единственное, что было плохо в таком подходе тогда - отсутствие модульности и локальности в JS. Но с приходом современных подходов к разработке эта проблема ушла.

В JS есть классный объект, который позволяет отслеживать изменения размеров элементов и позволяет реагировать на них. Вот пример его использования.

Иногда видение других людей бывает ошибочным. Я много раз замечал, что нужно полагаться на своё мнение, а не на мнение других. Если так делаешь, то обычно всё идёт так, как надо. Когда я работал в компании SimbirSoft, для привлечения сотрудников и рекламы компании, мы писали технические статьи. Мне пришла в голову статья посвящённая хукам в React. Сотрудник, который в нашем направлении отвечал за PR, сказал, что такая тема не зайдёт на Хабр. Однако, я настоял на том, что хочу опубликовать её именно на Хабр. В результате, сейчас это самая популярная статья компании посвящённая frontend с 79к прочтениями. Можете сами в этом убедиться.

https://habr.com/ru/companies/simbirsoft/articles/652321

Пробовал самостоятельно писать статью для Хабра. При её публикации столкнулся с забавной политикой портала. Для того, чтобы статья смогла выбраться из песочницы, она должна быть одобрена кем-то из Хабра, кто был одобрен ранее. Очень напомнило закрытый клуб, куда можно попасть только по приглашению участников. Самое обидное, что статьи в песочнице являются анонимными и просто невозможно оценить сколько человек её прочитали. Но если судить, что на мой YouTube канал с этой статьи на текущий момент пришли 1546 человек, видно, что тема интересна пользователям.

https://habr.com/ru/sandbox/186102/

Очень часто возникают ситуации, что backend ещё не готов, а необходимо разрабатывать frontend часть. Естественно в такие моменты приходится подменять данные в коде. Это приводит к некоторым неудобствам. Вполне можно забыть что-то убрать, либо что-то не учесть. Но к счастью, есть расширение для браузера "Tweak", которое позволяет смоделировать любой ответ сервера и с точки зрения разработчика это выглядит так, как будто на запрос ответил реальный сервер.

https://tweak-extension.com/

Иногда в процессе разработки бывает необходимо подменить заголовки запроса. В качестве примера приходит в голову локализация (Accept-Language). Подмена этого заголовка поможет протестировать, как будет работать приложение в браузерах у пользователей, которые используют другие языки. И благодаря браузерному расширению ModHeader это становится возможным. Вы можете задать любой заголовок, который Вам нужен. И с точки зрения сервера это будет выглядеть так, как будто в запросе есть этот заголовок.

https://modheader.com