[Из песочницы] Текстовый туториал по React.js и Redux на русском
Закончил работу над парой подробных текстовых туториалов на русском. Постарался уделить как можно больше времени практике. По ходу повествования есть вопросы, задачи и решения.
Курс про Redux попал в официальную документацию.
Оба руководства бесплатны и выложены на gitbook (можно скачать PDF, ePub, mobi).
В текстах нарочно участвуют термины переведенные на русский (например, состояние), английские (state), либо английский термин написанный по-русски — стейт. Считаю это допустимым, и даже более того, удобным для читателя.
React.js для начинающих
В данном курсе затронуты основы «реакта». Результатом будет небольшое приложение, в котором пользователь сможет добавить новость в ленту новостей.
Здесь специально не рассматривается webpack, hot module replacement и так далее. Реакт — это библиотека, значит достаточно просто добавить скрипт на страницу и начать писать на нем.
Чуть подробнее чем остальные темы, в курсе разобрана работа с формой (контролируемые и неконтролируемые компоненты). Остальные разделы — минимум текста. Не забыты propTypes.
В заключении курса (на данный момент) рассматривается простая реализация системы глобальных событий. Что плавно подводит читателя к тому, почему flux (и Redux) были созданы.
В планах написать об анимациях.
Код — ES5. Прямая ссылка на курс (PDF, ePub, mobi).
Redux
В данном курсе наоборот, добавлены webpack и поддержка HMR, разработка становится более комфортной, но, возможно, несколько запутанной на стадии подготовки, если читатель никогда не работал с webpack и babel.
Результатом будет мини-приложение, которое позволить получить фото из VK за разные года, отсортированное по «лайкам». Освящены запросы выполнения ajax-запросов в частности и «как вообще это работает», если вы решили использовать Redux подход.
Для тех, кто только выбирает flux-архитектуру, или вообще еще не работал с react, хочу сказать, что redux подход мне очень симпатизирует. На мой взгляд он хорошо структурирует код и делает его читаемым. Даже если вы откроете «слегка подзабытый» проект, то вам не потребуется много времени на то, чтобы вспомнить что и как работает.
В планах — роутинг, оптимизация сборки.
Код — ES2015/ES7. Прямая ссылка на курс (PDF, ePub, mobi).
В качестве заключения
Буду рад услышать критику по тексту, по коду и вообще. Какие главы плохо написаны (если вы «бывалый»), либо какие главы вам были не понятны (если вы «начинающий»)?
Какие вопросы были не затронуты в туториалах, но на которые вы жаждите узнать ответ?
Спасибо за внимание.
