React

Если вы серьезно относитесь к изучению React, лучшего места для этого нет. Первоначально запущенный в 2016 году, этот курс прошел десятки тысяч разработчиков и имеет средний рейтинг 4,8 / 5. С тех пор мы перестроили его с нуля, включив в него все лучшие практики и новейшие API для создания профессиональных приложений React в 2019 году.

Что вы узанете?

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

Императивный против декларативного метода программирования

React использует декларативный подход к созданию и обновлению вашего пользовательского интерфейса. К сожалению, это, вероятно, мало что значит для вас, если вы не знаете, что означает «декларативный». Вы узнаете разницу между императивным и декларативным кодом и узнаете, как это может помочь вам написать лучший пользовательский интерфейс.

Композиция против наследования

Реакт это все о композиции. Вы узнаете, что это значит и чем оно отличается от традиционного способа написания программного обеспечения с наследованием.

NPM

Реакт не принесет вам пользы, если вы не можете добавить его в свое приложение. Вы узнаете все о NPM (компания и менеджер пакетов), чтобы более эффективно управлять внешними пакетами.

Webpack

По своей сути webpack является модульным компоновщиком. Вы узнаете, что это значит, как это может помочь вам, и что-нибудь еще, что вы когда-либо захотите узнать о Webpack и как его использовать.

React Elements vs React Components

Вы не можете создать приложение React без компонентов, и вы не можете создавать компоненты без элементов. Вы узнаете разницу между ними и тем, что JSX делает за кулисами.

JSX

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

props

props для компонентов, а аргументы для функций. Вы узнаете все о props и о том, как их использовать для передачи информации в компоненты.

Отображение списков в действии

В конце концов, мы все просто прославленные разработчики списков. Вы узнаете, как эффективно отображать списки данных с помощью React.

Ключевое слово "this"

Ключевое слово this - это функция JavaScript, которая позволяет вам вызывать функции с различными объектами фокуса. Требуются знания для любого разработчика JavaScript и React.

.call, .apply, .bind

Это не просто хороший вопрос для интервью. Понимание различий между .call, .apply и .bind в JavaScript поможет вам с некоторыми аспектами создания приложений React.

Управление состоянием в действии

Это где React сияет. Вы узнаете все о добавлении и управлении состоянием с использованием компонентов React.

Чистые функции

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

PropTypes

Что если вы передадите строку компоненту, который ожидает объект? Вы узнаете о PropTypes, который поможет вам избежать этой проблемы.

Жизненный цикл компонента

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

Запросы API в React

Если ваше приложение не извлекает внешние данные, это просто статический веб-сайт. Мы рассмотрим ключ к созданию динамических веб-сайтов, управляемых данными - выполнение запросов API в React.

React Icons

Библиотека значков React является наиболее популярным способом добавления значков в приложение React. Вы узнаете API и какие опции доступны для вас.

Формы в действии

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

Контролируемые и неконтролируемые компоненты

С React компоненты управляют своим собственным состоянием. Вы узнаете разницу между контролируемыми и неконтролируемыми компонентами, которая в центре этой проблемы.

Композиция с детьми React

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

props по умолчанию

React позволяет передавать данные компонентам через props. Иногда вы хотите установить значения по умолчанию для определенных реквизитов, если они не передаются в компонент. Вы узнаете, как это сделать, используя defaultProps.

Компоненты высшего порядка

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

React Render props

Компоненты высшего порядка позволяют повторно использовать логику с состоянием, но API немного странный. Вы узнаете другой шаблон для выполнения этой же вещи - React Render props.

React Context

Часто вам нужно передавать данные вглубь дерева компонентов. Одним из способов избежать передачи данных через каждый компонент является React Context. Вы узнаете API, а также когда вы должны и не должны его использовать.

React Router

Любому нетривиальному приложению понадобится роутер. Вы изучите теорию и API самого популярного маршрутизатора в экосистеме React, React Router.

Class Fields

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

Создание приложений React для производства

По умолчанию React входит в режим разработки. Вы узнаете, как перейти в рабочий режим, а также о других шагах, необходимых для подготовки приложения React к работе.

Развертывание и хостинг

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