Вот я и завершила последний проект по Фронтэнду. Крайне этому рада!
Нелегко мне дался и этот проект. Начала я его 23 августа, сдала на первую проверку 18 сентября. 11 октября спустя 6 проверок проект наконец-то приняли.
Проблемы начались с первого шага: ни в какую не хотел работать хот-лоадер. Что я только не делала, и девсервер подключала с прокси, и какой-то вебпак-хот-клайинт для коа, и реакт-хот-лоадер... Всё тщетно. Когда мне всё это надоело, снесла все файлы проекта и скопировала сервер заново. После установки, сборки и запуска хот-лоадер заработал. Даже подключение реакт-хот-лоадера прошло гладко.
Второй шаг вызвал у меня ужас и панику. Напомнил известную картинку про рисование совы. Сразу столько всего нового!
Моему продвижению по проекту мешало тяжелое ухудшение самочувствия в связи с сезонной аллергией и невыносимой жарой. Продуктивность была крайне низкой. Пока не применила испытанный и незаменимый прием с разбиением сложной задачи на несколько малых продвинуться вперёд не удавалось.
Пара дней у меня ушло на понимание сокетов. Они чем-то похожи на пинг-понг: вызов события на сервере обрабатывается листенером на клиенте, а вызов события на клиенте обрабатывается листенером на сервере. Вроде просто и логично, но почему-то нигде об этом прямо не написано. Больше всего помог разбор работающего примера из документации.
Как говорится, у страха глаза велики, и все остальные новые инструменты — js-cookie, faker, декораторы — оказались гораздо проще в освоении. Не считая, конечно, ридакса, с которым у меня уже был опыт.
Немного заморочилась с построением модалок, взяв за основу рекомендации от Дэна Абрамова. Здесь было важно понять, что каждая модалка должна быть отдельным компонентом. А я сперва пыталась все существующие модалки разместить в одном компоненте.
Так вышло, что я сама себе существенно усложнила задачу, реализовав вместо требуемого инпута текстовое поле и добавив перевод строки на shift + enter / ctrl + enter. Сначала я реализовала всё это жутким кастомом, но после замечаний Кирилла переделала всё с использованием готовых библиотек (react-autosize-textarea, react-keyboard-event-handler). Понравилось. Теперь на работе тоже при каждом удобном случае ищу готовые компоненты. Код выглядит чище, и меньше вероятности наткнуться на странный баг.
Много пришлось повозиться с Redux Form. Дело в том, что я решила реализовать отправку сообщения не по нажатию на кнопку, а по нажатию на enter. Из-за этого валидация не работала нужным образом. Пришлось переносить валидацию в функцию сабмита, как в примере из документации для работы с удаленной кнопкой. А саму функцию сабмита передавать в пропсах.
Сначала я использовала много рефов — так казалось проще. Но ментор запретил их использовать без крайней на то необходимости, поэтому пришлось долго искать более правильные пути.
Узнала как правильно строить ридакс: экшнов должно быть минимум, а вся обработка должна происходить в редьюсерах. Не нужно на каждом изменение стора отправлять экшн. Один экшн может обрабатываться в разных редьюсерах. Почему-то во время прохождения курсов этот момент от меня ускользнул. Как и то, что данные правильно нормализовать в mapStateToProps, а рендерить чистый jsx.
И, последний момент: благодаря замечаниям и комментариям Кирилла разобралась, как должны работать скрипты и модули. До этого даже после прочтения соответвующей статьи в голове и в коде оставалась каша.
Последний проект очень сильно держал в напряжении. Даже, кажется, основная работа отошла на второй план. Часто не могла уснуть, если знала, что нужно исправить какой-то баг...
Очень рада, что удалось пройти всю профессию целиком. Очень благодарна Кириллу за менторство.
Дальше продолжу штурмовать Node.js.