Я начал с курса Стивена Грайдера на Udemy под названием Modern React and Redux.

Обзор

Мой самый большой пробел до этого момента заключался в том, что я прошел кучу руководств и имею представление о концепциях, но когда приходит время их применять, я полностью теряюсь. Я считаю себя основным потребителем, который также заинтересован в создании вещей. Итак, я интуитивно начинаю с DOM, того, что видит и делает потребитель, и пытаюсь построить приложение, но большинство руководств, которые я взял, начинаются с сорняков и никогда не заканчиваются потребительской стороной вещей. , включая Codecademy.

К счастью, этот курс отличается! Стивен начал курс с очень правдоподобного и реального вайрфрейма — урезанной версии Youtube с использованием Youtube API. Он знакомит нас с концепциями, необходимыми для создания приложения для этого каркаса. Начиная с настоящего каркаса, вы чувствуете себя намного более «реальным».

В этом разделе Стивен рассказал нам об основах структурирования приложения React на компоненты. Кроме того, настройка базового поля ‹input /› и обработка его состояния в файле компонента search_bar.js, а также отрисовка его обратно в DOM через родительский файл index.js.

Индикатор

Ключевые выводы

  1. Настройка каталога src, каталога компонентов, файлов index.js и search_bar.js. Я могу начать с отсутствия каталога src, чтобы иметь ‹input /› в DOM, чтобы пользователь обновлял его состояние, а значение отображалось обратно в DOM в режиме реального времени.
  2. Фигурные скобки {} в операторе импорта говорят React импортировать объект из указанного файла И сделать его доступным в качестве константы в текущем файле.
  3. Функциональные компоненты используются, когда нам буквально нужна одна функция в компоненте, тогда как компоненты на основе классов предпочтительнее, когда нам нужно вести внутреннюю запись, т. е. компонент знает о сам. Стивен рекомендует всегда начинать с функциональных компонентов, если не требуется иного.
  4. Контролируемый элемент — это элемент, значение которого задается набором, а не элемент, устанавливающий состояние компонента, в котором он находится.

Пробелы

  1. Синтаксис: нужно специально освоить синтаксис ES6, но, надеюсь, я стану лучше по ходу курса.

Увидимся завтра на Дне 11 — Udemy Modern React and Redux | Ajax-запросы с React.

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

✉️ Подпишитесь наCodeBurstраз в неделю Email Blast,🐦 Подпишитесь наCodeBurstна Twitter, просмотрите🗺️ Дорожную карту веб-разработчиков на 2018 год и🕸️ Изучите комплексную веб-разработку .