Чему меня научил React

Изучение новой технологии кропотливое и хлопотное занятие. Только открываешь Google и через несколько часов находишь себя в море информации: статьи, учебники, видео. И каждый лектор утверждает, что его метод обучения совершенный, а советы уникальны.

Начать лучше всего с основных концепций, а уже после погружаться в океан знаний.

Затем разработать собственный подход к изучению.

В статье я поделюсь своим опытом: расскажу о концепциях изучения и как систематизировать знания.

Итак, начнем!

Следите за изменениями в React

Помните начальное объявление версии 16.3.0? Все были в предвкушении.

Вот некоторые из изменений и улучшений:

• Official Context API
• createRef API
• forwardRef API
• StrictMode
• Component Lifecycle Changes

Команда React Core делает большую работу, улучшая технологию. А в версии 16.4.0 мы получили Pointer Events.

Дальнейшие изменения, безусловно, придут, и это всего лишь вопрос времени: Async Rendering, Caching и многие другие.

Поэтому, если вы хотите быть топовым разработчиком, будьте в курсе событий.

Узнавайте, как все работает, почему разрабатываются обновления, какие проблемы решаются с их помощью и как облегчается процесс разработки.

Разбивайте код на маленькие части

React основан на компонентах, поэтому используйте эту идею и не бойтесь разделять большие куски кода на более мелкие.

Иногда простой компонент может быть сделан из 4-5 строк кода, это совершенно нормально.

Сделайте так, чтобы новый человек, который встретится с вашим кодом, не потратил много времени на разбор того, как все работает.

Делайте компоненты простыми. Если это улучшит читаемость, тестирование кода и уменьшит smells кода, это отличная победа для всех в команде.

В примере выше свойства являются статическими. Таким образом, у нас есть чистый компонент, который отвечает за сообщение об ошибке Not Found, и ничего больше.

Кроме того, если вам не нравятся классы CSS как имена классов во всем мире, я бы рекомендовал использовать стилизованные компоненты. Это сделает код более читабельным.

Если вы боитесь создавать много компонентов из-за захламления папок файлами, то переосмыслите, как вы структурируете свой код. Я использую фрактальную структуру.

Всегда развивайтесь

Вам будет казаться, что вы еще не всё знаете, чтобы перейти к более сложным темам. Тут заключается опасность: так можно думать всегда и оставаться на том же уровне. Всё, что нужно сделать, это перестать беспокоиться и бросить себе вызов.

Изучая более сложные темы, вы начнете лучше разбираться в основах и поймете, как они используются для большинства случаев.

Есть множество паттернов, которые можно изучать:

• Compound Components
• High Order Components
• Render Props
• Smart/Dumb Components
• many others (try out Profiling)

Познакомьтесь со всеми и вы узнаете, для чего и где они используются.

Не бойтесь пробовать что-то новое в своей работе. Будьте готовы к тому, что люди будут спрашивать почему вы используете те или иные методы. Это нормально. Ваша задача - отстаивать свою позицию, приводя сильные аргументы. Даже если ваши предложения отвергнут, вы будете знать, что хотя бы попытались.

А еще я советую экспериментировать с личными проектами. Цель вашей работы в том, чтобы решать существующие проблемы и облегчить дальнейшую разработку.

Не усложняйте

Звучит банально, но совет важный. В работе и жизни нужно стремиться к равновесию. Будьте практичными и пишите такой код, который легко понять.

Если вам не нужен Redux, но вы хотите использовать его, потому что все так делают, не советую даже начинать. Нет ничего плохого в том, чтобы иметь мнение отличное от других.

Когда вы пишите код, не забывайте, что кроме вас есть и другие люди, которые будут с ним работать. Представьте ситуацию: коллега уходит в двухнедельный отпуск и его задачу вешают на вас. Вы открываете код и понимаете, что здесь черт ногу сломит и надо потратить 8 часов, чтобы как-то разобраться в написанном. Не очень приятно, согласитесь.

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

Рефакторинг, рефакторинг и ещё раз рефакторинг

Вам предстоит переписывать код десятки раз. Но не беспокойтесь, это естественный процесс обучения. На ошибках мы учимся и становимся лучше.

Не забывайте тестировать свою работу. Smoke, unit, integration, snapshot — не стесняйтесь использовать их.

Если вы, как и многие люди, считаете, что тестирование - это пустая трата времени, задумайтесь:

• Вам не придется сидеть со своим коллегой, объясняя, как все работает.
• Вам не придется сидеть с коллегой, объясняя, почему все сломалось.
• Вам не придется исправлять ошибки.
• Вам не придется исправлять ошибки, которые были найдены через 3 недели.
• У вас будет больше личного времени.

Неплохо, да?

Если вам это нравится, вы добьетесь успеха

В прошлом году моей целью было стать профи в React. Я хотел быть полезным другим, делиться своими знаниями и опытом.

Я ночами напролет писал код, смотрел видео, что-то изучал. Самое главное, мне это нравилось. Я получал удовольствие от обучения.

Сейчас я могу выполнять такие проекты, о которых раньше даже не мог и мечтать.

И сегодня я до сих пор ощущаю то же волнение и наслаждение, что и год назад.

Поэтому спросите себя: «Тебе нравится то, что ты делаешь?»

Если нет, не тратьте на это время. Продолжайте искать своё дело, о котором сможете говорить часами, посвящать всего себя этому и быть счастливыми.

Потому что невозможно достичь успеха в том, что ты не любишь.

Адаптированный перевод статьи The most important lessons I’ve learned after a year of working with React от Digital Skynet 😉