- #SkladchinaVip
- #1
[javascript.ru] Курс по React.JS [2017]
- Ссылка на картинку
-
В этом курсе мы с вами шаг за шагом пройдем от знакомства с основными идеями до использования самых новых инструментов и инфраструктуры React, на практике будем развивать одностраничное приложение. Начнем с построения простых компонентов, научимся настраивать окружение, поговорим про системы сборки и особенности работы с ES2015 синтаксисом.
Постепенно мы разберем особенности построения SPA с использованием React, будем использовать сторонние компоненты и библиотеки для создания бизнес-логики. Вы в деталях узнаете классическую для React-приложений архитектуру: Unidirectional dataflow, и научитесь строить ее с использованием современной и наиболее популярной реализацией Flux – Redux.js
Курс состоит из 4-х блоков:
Знакомство с React
В этом блоке мы разберем основные идеи Реакта, научимся писать простые компоненты и узнаем, в чем принципиальное отличие React.js от других популярных фреймворков. Создадим первые компоненты, используя декларативный подход.
Сейчас, говоря "React", уже редко имеют ввиду саму библиотеку, которая просто позволяет декларативно описывать ваш UI. Сегодня React – это большая инфраструктура, которая включает в себя различные бибилиотеки для работы с данными, бизнес-логикой, сторонними компонентами, декораторами и множеством другого полезного кода.
Когда приложения становятся сложнее и в них появляется интерактивность, приходиться задумываться про организацию бизнес-логики, настраивать потоки данных и взаимодействие с сервером. В процесе построения простого новостного приложения мы детально разберем самую популярную библиотеку для одностороннего потока данных, узнаем ее особенности и научимся использовать дев-тулзы.
Разработка single-page applications – одно из основных направлений фронтэнда. Мы разберем, как строить их, используя React. Научимся использовать react-router и продвинутые элементы API React.JS.
Постепенно мы разберем особенности построения SPA с использованием React, будем использовать сторонние компоненты и библиотеки для создания бизнес-логики. Вы в деталях узнаете классическую для React-приложений архитектуру: Unidirectional dataflow, и научитесь строить ее с использованием современной и наиболее популярной реализацией Flux – Redux.js
Курс состоит из 4-х блоков:
- Знакомство с React.
- Инфраструктура React.
- Построение приложений с React: Redux.js.
- React для SPA: react-router и продвинутые API Реакта
Знакомство с React
В этом блоке мы разберем основные идеи Реакта, научимся писать простые компоненты и узнаем, в чем принципиальное отличие React.js от других популярных фреймворков. Создадим первые компоненты, используя декларативный подход.
- Обзор и сравнение популярных современных фреймворков: Angular, Ember, React.
- Настройка Babel и Webpack, HMR и React-transform (react-hot-loader).
- Основы работы с Реактом, Virtual DOM, JSX.
- Три синтаксиса для компонентов: Stateless components, ES2015-классы и React.createClass.
- Поток данных: props и state.
- Lifecycle: Жизнь React-компонента от инициализации до unmount.
- Связь с DOM: keys & refs.
- Готовим компоненты к повторному использованию: propTypes, mixins, decorators.
Сейчас, говоря "React", уже редко имеют ввиду саму библиотеку, которая просто позволяет декларативно описывать ваш UI. Сегодня React – это большая инфраструктура, которая включает в себя различные бибилиотеки для работы с данными, бизнес-логикой, сторонними компонентами, декораторами и множеством другого полезного кода.
- Вложенные компоненты в JSX при помощи props.children.
- Оптимизируем наше приложение с shouldComponentUpdate.
- Immutable.js: узнаем как и зачем использовать иммутабельные данные.
- Анимации в React, CSSTransitionGroup.
- Использование сторонних компонентов.
Когда приложения становятся сложнее и в них появляется интерактивность, приходиться задумываться про организацию бизнес-логики, настраивать потоки данных и взаимодействие с сервером. В процесе построения простого новостного приложения мы детально разберем самую популярную библиотеку для одностороннего потока данных, узнаем ее особенности и научимся использовать дев-тулзы.
- Знакомство с Flux – разбор основных элементов и идей.
- Построение компонентов синхронной и асинхрнонной бизнес логики с Flux.
- Ключевые отличия Redux и Flux.
- Особенности Redux.js: функциональный подход, Redux dev tools, возможности для мониторинга и универсальных приложений.
- Store, как иммутабельный отъект: Redux + Immutable.js.
- Actions и Reducers, как чистые функции.
- Настраиваем синхронный поток с Redux, переиспользуем созданные ранее компоненты.
- React-redux для связи компонентов с логикой.
- Side-effects в Redux: создание и использование Middlewares.
- Варианты реализации асинхронных actions в Redux.
Разработка single-page applications – одно из основных направлений фронтэнда. Мы разберем, как строить их, используя React. Научимся использовать react-router и продвинутые элементы API React.JS.
- Зачем нужен роутинг и как он устроен, проектируем структуру приложения.
- Настраиваем вложенные роуты.
- Выбираем и настаиваем history для нашего приложения.
- Используем context – еще один механизм передачи данных.
- Объеденяем react-router и Redux.
- Обзор Advanced API react-router.
- Авторизация в react-router.
Показать больше