Rivalry2

HTML Diff

0 added 0 removed

Original 2026-01-01

Modified 2026-02-26

1 Вот я и завершила последний проект по Фронтэнду. Крайне этому рада!

2 Нелегко мне дался и этот проект. Начала я его 23 августа, сдала на первую проверку 18 сентября. 11 октября спустя 6 проверок проект наконец-то приняли.

3 Проблемы начались с первого шага: ни в какую не хотел работать хот-лоадер. Что я только не делала, и девсервер подключала с прокси, и какой-то вебпак-хот-клайинт для коа, и реакт-хот-лоадер... Всё тщетно. Когда мне всё это надоело, снесла все файлы проекта и скопировала сервер заново. После установки, сборки и запуска хот-лоадер заработал. Даже подключение реакт-хот-лоадера прошло гладко.

4 Второй шаг вызвал у меня ужас и панику. Напомнил известную картинку про рисование совы. Сразу столько всего нового!

5 Моему продвижению по проекту мешало тяжелое ухудшение самочувствия в связи с сезонной аллергией и невыносимой жарой. Продуктивность была крайне низкой. Пока не применила испытанный и незаменимый прием с разбиением сложной задачи на несколько малых продвинуться вперёд не удавалось.

6 Пара дней у меня ушло на понимание сокетов. Они чем-то похожи на пинг-понг: вызов события на сервере обрабатывается листенером на клиенте, а вызов события на клиенте обрабатывается листенером на сервере. Вроде просто и логично, но почему-то нигде об этом прямо не написано. Больше всего помог разбор работающего примера из документации.

7 Как говорится, у страха глаза велики, и все остальные новые инструменты - js-cookie, faker, декораторы - оказались гораздо проще в освоении. Не считая, конечно, ридакса, с которым у меня уже был опыт.

8 Немного заморочилась с построением модалок, взяв за основу<a>рекомендации</a>от Дэна Абрамова. Здесь было важно понять, что каждая модалка должна быть отдельным компонентом. А я сперва пыталась все существующие модалки разместить в одном компоненте.

9 Так вышло, что я сама себе существенно усложнила задачу, реализовав вместо требуемого инпута текстовое поле и добавив перевод строки на shift + enter / ctrl + enter. Сначала я реализовала всё это жутким кастомом, но после замечаний Кирилла переделала всё с использованием готовых библиотек (react-autosize-textarea, react-keyboard-event-handler). Понравилось. Теперь на работе тоже при каждом удобном случае ищу готовые компоненты. Код выглядит чище, и меньше вероятности наткнуться на странный баг.

10 Много пришлось повозиться с Redux Form. Дело в том, что я решила реализовать отправку сообщения не по нажатию на кнопку, а по нажатию на enter. Из-за этого валидация не работала нужным образом. Пришлось переносить валидацию в функцию сабмита, как в примере из документации для работы с удаленной кнопкой. А саму функцию сабмита передавать в пропсах.

11 Сначала я использовала много рефов - так казалось проще. Но ментор запретил их использовать без крайней на то необходимости, поэтому пришлось долго искать более правильные пути.

12 Узнала как правильно строить ридакс: экшнов должно быть минимум, а вся обработка должна происходить в редьюсерах. Не нужно на каждом изменение стора отправлять экшн. Один экшн может обрабатываться в разных редьюсерах. Почему-то во время прохождения курсов этот момент от меня ускользнул. Как и то, что данные правильно нормализовать в mapStateToProps, а рендерить чистый jsx.

13 И, последний момент: благодаря замечаниям и комментариям Кирилла разобралась, как должны работать скрипты и модули. До этого даже после прочтения соответвующей<a>статьи</a>в голове и в коде оставалась каша.

14 Последний проект очень сильно держал в напряжении. Даже, кажется, основная работа отошла на второй план. Часто не могла уснуть, если знала, что нужно исправить какой-то баг...

15 Очень рада, что удалось пройти всю профессию целиком. Очень благодарна Кириллу за менторство.

16 Дальше продолжу штурмовать Node.js.