Вопрос дня: нужно ли изучать React, чтобы построить блок Гутенберга?
Краткий ответ: нет. Вам не нужно ничего знать о React, чтобы построить блок Гутенберга. Причина в том, что WordPress проделал большую работу по абстрагированию React и основополагающих инструментов, которые он использовал для создания Гутенберга. WordPress создал свой собственный API, который вы можете использовать для создания своих блоков.
Реальный ответ
Я помню, когда я впервые начал работать с WordPress, я встречался с другими людьми, которые были разработчиками WordPress, и я спрашивал их, как долго они работают с PHP. Чаще всего ответом был «что такое PHP?». Я был поражен, что они назвали себя разработчиками WordPress и фактически создавали что-то без каких-либо знаний PHP. Некоторые из этих людей – это те, кого мы сейчас называем создателями сайтов, но многие на самом деле настраивали темы. Реальность такова, что они только что изучили синтаксис. Они узнали, что такое теги PHP, и знали, какие теги шаблонов можно вставить в них для настройки уже существующей темы. Теперь они не могли создать тему с нуля, но могли использовать начальный подход к теме.
Размышляя о разработке Gutenberg, вы хотите стать разработчиком Gutenberg, который не знает React? Если вы понимаете основополагающие инструменты, вы сможете сделать гораздо больше. Без понимания технологии, лежащей в основе Гутенберга, и того, как она работает, она ограничит вашу способность создавать блоки Гутенберга и ограничит ваше воображение о том, что вы можете сделать с Гутенбергом. Вот почему я думаю, что важно знать React.
Что такое React?
React – это в основном библиотека от создателей Facebook. Это работает так, что вы передаете свойства в представление, обычно называемое компонентом, и представление будет отображаться на основе этих свойств. Вы также можете передать обработчики событий как свойства, которые позволят вам сделать ваши представления интерактивными. Из-за способа, которым вы обычно делаете компоненты React в ES6, вы также будете использовать что-то под названием JSX. JSX – это синтаксис, созданный Facebook для React, который очень похож на HTML. У React есть отличная документация по JSX, поэтому я рекомендую вам взглянуть на них.
Что такое Redux?
Еще одна вещь, о которой вы, вероятно, захотите узнать больше, – это Redux, библиотека управления состоянием, которая обычно используется в React. WordPress использует Redux за кулисами для своего хранилища данных. Redux – это библиотека управления состоянием. React и Redux работают вместе довольно хорошо. Когда в редакторе Гутенберга происходит действие, запускается событие, которое проходит через Redux и обновляет глобальное состояние для редактора. Любое изменение в этом глобальном состоянии автоматически сигнализирует слоям React, что определенные свойства изменились, и любой компонент, зависящий от этих свойств, будет автоматически перерисован.
Чему я должен научиться?
Я рекомендую изучать ES6, JSX, React и Redux … в этом порядке. Это позволит вам научиться разрабатывать блоки Гутенберга с использованием современного JavaScript.
Когда вы начнете, я бы рекомендовал проверить создание блока Гутена . Это будет иметь все инструменты для создания блоков Гутенберга со всеми этими современными инструментами. После того, как вы более подробно ознакомитесь с принципами работы, я бы порекомендовал запустить команду «eject» в блоке «Создание Guten» и начать изучать Webpack и узнать больше о том, как настраивается процесс сборки.
Ресурсы, которые вы должны проверить
- JavaScript 30 – создайте 30 вещей за 30 дней с помощью Vanilla JavaScript
- Введение в ES6 – простое и понятное описание возможностей ES6
- Представляем JSX – собственное введение React в использование JSX
- React Courses на Egghead.io – Бесплатные курсы React и Redux
- Create React App – инструмент CLI для создания нового проекта React
- Create Guten Block – инструмент CLI для создания новых блоков Gutenberg
Статья была переведена для блога TechBlog.SDStudio.top
Источник: wpscholar.com