Привет! Я — мидл-разработчик на Vue, и на Хекслет пришла, чтобы прокачать отдельные навыки и почувствовать себя увереннее. В этом посте я бы хотела рассказать, почему я решила заниматься по треку «Веб-разработка на React», и накидать несколько идей, что можно учить дальше по этой теме.
Своими впечатлениями о других курсах на Хекслете я уже делилась в предыдущем посте. Моя основная цель сейчас — подтянуть знания перед собеседованиями, а также ознакомиться с новым фреймворком, чтобы при необходимости переключиться на него. Так что в этом месяце я решила сделать фокус на следующих треках:
- «Веб-разработка на React»
- «ООП в JS»
- «Алгоритмы и структуры данных»
- а также закончить ранее начатый (и очень крутой) трек «Асинхронное программирование на JS»
Все треки из этого списка я уже успела потрогать, и они меня впечатлили — к треку по ООП, например, практически ничего ни прибавить, ни убавить. В этом посте я бы хотела поделиться своими впечатлениями именно о треке по React, так как он отлично подходит для начинающих, но у продолжающих обязательно возникнут вопросы, почему в нем нет некоторых тем. Как я понимаю, курсы с этого трека изучаются также в профессии «Фронтенд-разработчик» с нуля, так что их сможет пройти любой желающий — ведь продолжающие могут при желании изучить отдельные темы и сами.
В целом этот трек мне понравился, и меня порадовало, что в нем есть курсы не только по React, а также по DOM API и по архитектуре фронтенда — новичкам без них было бы очень сложно перейти сразу к компонентам. Я бегло пролистала эти две темы, так как уже знакома с ними, и перешла сразу к React.
Вводный курс «JS: React» отлично подойдет для всех, кто ни разу не видел синтаксис React и не знаком еще ни с одним фреймворком, так как покрывает все самое важное — состояния, props, jsx, события, жизненный цикл компонента — в общем, все, что нужно, чтобы броситься клепать свои первые формы. Отдельный респект авторам курса за темы по автоматному программированию и производительности — так, вопрос по PureComponent я недавно услышала на одном из мок-собеседований.
К курсам «JS: Redux» и «React: Redux Toolkit» у меня тоже нет вопросов — их после незамысловатого Vuex во Vue изучать было интересно, потому что приходится много думать о неизменяемости. А еще меня очень впечатлили темы по нормализации данных и редьюсерам (как все удобно!) — надеюсь однажды сравнить возможности Vuex и Redux более подробно.
Наверняка у многих разработчиков, имевших опыт хотя бы с одним фреймворком, курс «JS: React Hooks» мог оставить неоднозначные впечатления. Да, курс отлично раскрывает темы, которые поднимает (и они самые важные и часто применяемые) — но ведь это не все хуки, которые есть в React! Поэтому остаток поста я бы хотела посвятить тому, что делать тем, кто не хочет останавливаться на достигнутом.
Самый простой вариант — открыть документацию по React, и идти по ней, к тому же ее как раз недавно обновили, и пользоваться ей — одно удовольствие. Но, как и многие, я не ищу легких путей! А также хочу иметь перед глазами больше одного плана — так проще выявить самые часто упоминаемые темы.
В качестве основного ориентира для дальнейшего изучения React я беру план с опенсорс-платформы roadmap.sh. Здесь собрано множество карт развития для разработчиков всех мастей, а также для отдельных скиллов — и React там посвящена отдельная дорожная карта. Все планы интерактивны, и по каждой теме есть ссылка на бесплатный источник или официальную документацию. То, что нужно!
Итак, мои идеи, на какие концепты из React стоит обратить внимание:
- Почитать главу из документации Thinking in React — название говорит само за себя
- Познакомиться с главой State as a Snapshot — помогает лучше разобраться с логикой ре-рендера
- Сравните работу useState и useReducer
- Изучили хук useEffect? Почитайте, почему он не всегда нужен
- Конечно же, не забываем про кастомные хуки
- Одна из моих любимых возможностей во Vue — computed (вычисляемые свойства). Его альтернатива в React — useMemo (и туда же useCallback)
- Хуки можно изучать еще долго — вот, например, useTransition
- На какие state management решения можно обратить внимание (согласно roadmap.sh) — Zustand, Mobx, а также чемпион среди легковесов — nanostores
- Не оставим в стороне React Router
- И ознакомимся со styling решениями — CSS Modules, styled-components, Emotion, Tailwind и Chakra UI — глаза разбегаются, но в общих чертах преимущества разных систем стоит знать.
Этот список можно и продолжать, но его точно хватит на первое время. А если не хватит — углубитесь в «Тестирование фронтенда» (относительно React нас интересует урок «React Testing Library») или в «JS: Express». А я, пожалуй, начну проект Чат (Slack), повторю пройденное и поучусь работать с Formik и websockets.
Успехов!
