Как Разрабатывать HEADLESS Проекты на React.js + WordPress API. Руководство для Чайников!

Поделиться
HTML-код
  • Опубликовано: 22 дек 2024

Комментарии • 105

  • @bedeveloper
    @bedeveloper  10 месяцев назад +5

    Для более детального изучения рекомендую мою статью на блоге genius.courses/%d0%ba%d0%b0%d0%ba-%d1%81%d0%be%d0%b7%d0%b4%d0%b0%d1%82%d1%8c-%d1%81%d0%b0%d0%b9%d1%82-%d0%bd%d0%b0-react-%d0%b8-wordpress-headless/

  • @МаксимВакуленко-к8г
    @МаксимВакуленко-к8г 10 месяцев назад +56

    Интересно! Надо больше! Давайте курс по HEADLESS. Например Макет + React + Wordpress. Прям все с нуля.

  • @tatsianavaleri
    @tatsianavaleri 10 месяцев назад +7

    Да, тема очень интересная, просим осветить ее более подробно. Большое спасибо за Вашу работу !!!!!!

  • @nvvkanal
    @nvvkanal 9 месяцев назад +3

    Тема связки Wordpress и React очень интересная! Очень жду расширенный и подробный туториал!!!

  • @xniki4x
    @xniki4x 10 месяцев назад +5

    удивляюсь как каждую субботу выходят видео по теме которая мне нужна))))

  • @deadscorpion1200
    @deadscorpion1200 10 месяцев назад +5

    Последнюю неделю я именно что ищу на ютубе, так это wordpress headless, хотя не на react, а на vue. И прям очень надоело слушать пустые лекции на английском, так что я очень рад, Александр, что вы наконец-то тоже взялись за эту тему! Её обязательно надо развивать!! Ибо в русскоязычном сегменте инфы ну прям мало на эту тему...

  • @1caccount756
    @1caccount756 10 месяцев назад +9

    HEADLESS Проекты на React.js + WordPress API

  • @Александр-з9к8й
    @Александр-з9к8й 10 месяцев назад +4

    Спасибо за Вашу работу! смотрю Вас более 5 лет

    • @bedeveloper
      @bedeveloper  10 месяцев назад +1

      Спасибо! Продолжай в том же духе)

  • @СергейБудко-ъ5ч
    @СергейБудко-ъ5ч 10 месяцев назад +1

    Спасибо за урок. Давно хотел перенести старые проекты на React, а админку оставить в WP. Жду новых уроков. Вы молодец!

  • @Qwerty-gz3kb
    @Qwerty-gz3kb 10 месяцев назад +3

    Однозначно стоит делать курс! инфы в ру-тубе по этой связке нет. Хотелось бы в платном курсе увидеть production-ready реализацию (SSR для SEO на том же next.js, фетч контента постов из редактора Gutenberg, фетч seo полей того же yoast seo из админки).

  • @1caccount756
    @1caccount756 10 месяцев назад +3

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

  • @tarttartuy8201
    @tarttartuy8201 10 месяцев назад +2

    Очень полезно и актуально! Нужен курс

  • @dv9428
    @dv9428 10 месяцев назад +2

    Интересно! Еще больше видео по этой теме нужно)

  • @sergeynazarenko2316
    @sergeynazarenko2316 10 месяцев назад +2

    Очень интересно, ждём курс с примером)

  • @kiralatysheva6794
    @kiralatysheva6794 10 месяцев назад +3

    Интересно. Надо больше!

  • @neverchain
    @neverchain 10 месяцев назад +2

    очень интересная тема! жду серию видео о headless worpress

  • @MagicMightNew
    @MagicMightNew 10 месяцев назад +1

    Невероятная удача. Я как раз сейчас, набивая шишки (первый раз всегда больно), делаю план для переезда на реакт существующего сайта с вп бэком. Спасибо!

  • @mister_andre
    @mister_andre 10 месяцев назад +2

    Интересная тема, спасибо Александр 👍

  • @filipakbash4785
    @filipakbash4785 10 месяцев назад +3

    Супер, давай еще!!!

  • @alexandermediantsev6354
    @alexandermediantsev6354 10 месяцев назад +2

    Тема очень интересная. Тем более, что нигде, именно такой, информации нет. Сейчас не понятно, как будет реализована, например, пагинация, фильтры, выборки и т.д. Как работать с вариативным товаром. И насколько это целесообразно. По тому, что Вы показали, кода нужно написать в 2 раза больше, чем на PHP. А вообще огромное Вам спасибо за вашу работу. Давно слежу за Вашим каналом. Все крутые фишки только у Вас 👍👍👍

  • @denspit7568
    @denspit7568 10 месяцев назад +1

    Очень интересно. Хотелось бы углубится в тему например woocommerce + vue

  • @cao_dzecbi
    @cao_dzecbi 10 месяцев назад +3

    Александр, прохожу ваш курс по php на udemy. Хотел сказать большое спасибо за ваш труд и отличную подачу материала!!

  • @elmaralijev7499
    @elmaralijev7499 10 месяцев назад +1

    Конечно интересно! Давайте больше этой темы!

  • @andydev7905
    @andydev7905 10 месяцев назад +3

    Спасибо за урок!
    Больше видео по реакту и вордпресу плз!

  • @BrestSouth
    @BrestSouth 10 месяцев назад +2

    Спасибо, интересно. Продолжайте!

  • @fckincummer4934
    @fckincummer4934 9 месяцев назад

    Дай бог тебе здоровья молодой человек!
    Огромное спасибо

  • @webstroymaster
    @webstroymaster 10 месяцев назад +1

    Спасибо за творчество! Тема интересная, Подобные реализации опять-же в зависимости от ситуации (поддержка SEO например) реализовывают больше на NEXT, если это REACT . С удовольствием посмотрю продолжение уроков на данную тему, чтоб были раскрыты темы от переноса шаблона с модалками, слайдерами , формами обратной связи и тд. до тестов производительности.

  • @mahmatqulovbobojon9402
    @mahmatqulovbobojon9402 10 месяцев назад +1

    Спасибо за материал, я так скажу, на эту тему хотят больше контента даже те кто не хотят об этом контента :),
    Об этом знают опытные прогеры а вот новчки и те кто занимается этим относительно недавно то им дуаю очень интересно это тема, про себя скажу точно что уже не терпится изучить эту тему и начать практиковать

  • @nikolay_it_master
    @nikolay_it_master 10 месяцев назад +3

    Думаю, стоит делать полный курс React+ Headless.

  • @ЕгорТишко́-ш9у
    @ЕгорТишко́-ш9у 10 месяцев назад +2

    Безусловно, тема очень интересная.

  • @ДмитрийГринь-ч7о
    @ДмитрийГринь-ч7о 10 месяцев назад +3

    Интересная тема, нужно развивать

  • @aleksandrasjarmalavicius7591
    @aleksandrasjarmalavicius7591 10 месяцев назад +3

    Больше реакта и вп! больше хедлесс! можно какой нибудь по серьезней проект попробовать сделать

  • @vladi4507
    @vladi4507 10 месяцев назад +1

    Очень круто, ждем новые видосы на тему headles и react

  • @shurinskiy
    @shurinskiy 8 месяцев назад

    Это просто прекрасно! Было здорово записать серьезный курс по взаимодействию rest api wp и react, с использованием woocommerce и нового 19-го реакта

  • @serhiididenko
    @serhiididenko 10 месяцев назад +3

    Очень интересная тема!!!

  • @ГеннадийОловянников
    @ГеннадийОловянников 8 месяцев назад

    Мне как начинающему React разработчику это видео было полезным. Лайк поставил

  • @samurai-csgo
    @samurai-csgo 10 месяцев назад +2

    А что в таких проектах делается с фронтенд частью самого wordpress? Как-то скрывается?

  • @ВадимБондарев-я8б
    @ВадимБондарев-я8б 6 месяцев назад

    это же магия вне Хогвардса ))круто!спасибо большое !!!!

  • @MikhailPavstyuk
    @MikhailPavstyuk 10 месяцев назад +2

    Очень интересно. Спасибо. Можно в качестве расширенного изучения: api работы с woocommerce и с кастомными типами постов.

  • @mailwood1388
    @mailwood1388 5 дней назад +1

    Почему React, когда есть их популярнейший фреймворк NEXT именно под web ? Чтобы потом мучаться с отсутствием SEO ?

  • @nikolayp5469
    @nikolayp5469 10 месяцев назад +2

    Очень интересно!

  • @СергейПротос-р1р
    @СергейПротос-р1р 10 месяцев назад +1

    Про htmx не было видео? Был бы интересен ваш разбор.

  • @efremov-denis
    @efremov-denis 10 месяцев назад +1

    Тема headless очень интересна. Стою перед выбором что лучше для этого использовать WordPress или же Strapi.

  • @mk3mk3mk
    @mk3mk3mk 8 месяцев назад

    Отлично! Спасибо за урок! Было бы интересно еще посмотреть, как делать POST запросы, чтобы например можно было создавать посты. И изменять и удалять.
    Да, и еще создавать свои кастомные типы полей и типы записей.
    И еще как бы структурировать API более менее понятно, а не так как это в WordPress по умолчанию.

  • @mourat9833
    @mourat9833 10 месяцев назад +1

    Было бы здорово узнать как можно авторизоваться из Реакта и отправлять данные, например заполнение формы.

  • @АлиМухамедалиев-ъ6ф
    @АлиМухамедалиев-ъ6ф 10 месяцев назад +2

    стоит расказывать

  • @vanmihaylovich
    @vanmihaylovich 10 месяцев назад +1

    Александр, расскажи:
    1) Необходимо ли менять DNS к сайту на WordPress раз он теперь доступен через API?
    2) Можно ли вынести статичный контент сайта в CDN и отправлять его туда посредством Git каждый раз, когда редакторы статей закончат свою работу в WordPress админке?

  • @НикитаМальцев-н8в
    @НикитаМальцев-н8в 5 месяцев назад

    Супер! Очень интересно!

  • @user-natal04ka
    @user-natal04ka 10 месяцев назад +1

    Крутяк 🎉

  • @mourat9833
    @mourat9833 10 месяцев назад +3

    Больше хедлесс, народу!

  • @kharisovruslan5523
    @kharisovruslan5523 10 месяцев назад +3

    Как раз такой делаю, только с Next

  • @sergeishmelev8000
    @sergeishmelev8000 10 месяцев назад +1

    Есть ли возможно использовать WP как полноценный бэкэнд , предоставляет ли он какие-то апи для этого? Например, загрузка изображений, регистрация и авторизация пользователей?

  • @БогданКожома-й6е
    @БогданКожома-й6е Месяц назад

    А как плагин для перевода подключить? В WP использую woocomerce

  • @yurichudaev
    @yurichudaev 10 месяцев назад +2

    чистый react? а как же seo, ssr?

  • @ListenFight
    @ListenFight 8 месяцев назад

    А есть же возможность, вставить react компонент, в сайт на ВордПресс?

  • @dmitryklyuev616
    @dmitryklyuev616 10 месяцев назад +3

    CRUD так можно реализовать?

    • @bedeveloper
      @bedeveloper  10 месяцев назад +4

      Да, WordPress API имеет возможности для CRUD. Он позволяет создавать, читать, обновлять и удалять записи в базе данных WordPress.

  • @i-wp-dev
    @i-wp-dev 4 месяца назад

    Хотелось бы увидеть решение для SSR headless wp with react

  • @citavod
    @citavod 8 месяцев назад

    Подскажите а имеет ли смысл связка react + wp для интернет магазина? и насколько она популярна на практике?

  • @sergeychistyakov8149
    @sergeychistyakov8149 10 месяцев назад +1

    Интересный подход. Но интересует момент относительно seo. Если реализовать блог используя react или vue для фронтенд части, то это будет spa подход и если он будет иметь вложенность страниц то он будет плохо индексироваться поисковиками. Да, можно рассматривать next.js (или nuxt.js если это vue) для ssr рендеринга с сервера. Но тогда нужно поднимать сервер на node.js. А в режиме ssg (когда статически генерируемый код) то мы теряем все преимущество реактивности, которые дают react или vue. Вопрос тогда заключается в том когда именно целесообразно использовать Headless подход и как быть с seo продвижением для таких сайтов?

    • @galkovskiy
      @galkovskiy 10 месяцев назад

      так на реакте или вью реализовывается админка, а не основная часть сайта. соответственно никакой угрозы для сео тут нет

    • @sergeychistyakov8149
      @sergeychistyakov8149 10 месяцев назад +1

      @@galkovskiy В подходе про который рассказывает автор видео (headless) в качестве админки выступает wordpress, а на реакте или вью автор предлагает делать публичную часть, которая может выступать в качестве того же сайта. И если это будет на выходе SPA (как на примере в видео) то вопрос SEO как раз таки открыт.

  • @Cranok911
    @Cranok911 10 месяцев назад +1

    + еще рассмотреть вариант рассмотреть HEADLESS с next js

  • @ВолодимирЖуківський
    @ВолодимирЖуківський 10 месяцев назад +1

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

    • @bedeveloper
      @bedeveloper  10 месяцев назад

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

  • @alexbalakshy6784
    @alexbalakshy6784 10 месяцев назад +1

    Если мы используем такой подход, через создание систему которая работает по API - то зачем нужем нагроможденный вордпресс ? Не проще ли написать бэкенд на Laravel ?

  • @ДмитрийРоманов-я5щ
    @ДмитрийРоманов-я5щ Месяц назад

    А что по SEO ?

  • @awenn2015
    @awenn2015 4 месяца назад

    Кстати вопрос к знатокам, тем кто часто использует headless, насколько профитнее из next.js тянуть данные напрямую из бд чем отправлять миллионы API запросов к cms?, у меня витает мысль что какая то команда уже давно переписала кор ядра по работе с бд на JavaScript и её можно использовать в виде класса в своем nextjs проекте, какие идеи?

  • @rizvan-dev
    @rizvan-dev Месяц назад

    Спасибо, очень интересно

  • @iExDll
    @iExDll 10 месяцев назад +1

    Спасибо, не знал о наличие такого способа в WordPress. Но естественно на продакшн я бы это не использовал - постов много может быть. Для грамотной реализации нужно делать свои api методы. Хотя думаю, уже существуют планы.
    А в чем такая нелюбовь к стандартному методу fetch? Вообще не понял прикола ставить axios в учебном примере.

  • @jauhien6872
    @jauhien6872 7 месяцев назад

    Привет!
    Спасибо за видео. Подскажи пожалуйста - возможно ли запустить фронт WP страницы как реакт приложение а к контенту обращатся через API? Или такой сценарий имеет какие то существенные минусы?
    !important; (для привлечения внимания)

  • @sergeynazarenko2316
    @sergeynazarenko2316 9 месяцев назад

    Александр планируете сделать курс по Headless на Udemy?

  • @awenn2015
    @awenn2015 4 месяца назад

    Теперь нужен ролик о том как внедрить ssr react в WordPress, установка v8j либо другой аналог который делает запрос к nodejs и рисует в php результат от ssr реакта, хотя там не совсем запрос, либа берет js файлы, исполняет его под капотом и в ответ получает html строку

  • @elmaralijev7499
    @elmaralijev7499 10 месяцев назад +2

    Правда, не совсем понятно, почему фронтенд на React, а база данных на WordPress? Почему не сделать фронтенд на WordPress также? Или WordPress используют только для создания базы данных? Тогда зачем WordPress именно? Есть же уже готовые базы данных, такие как Firebase, Supabase и так далее... Что я упускаю из виду? Кто подскажет?

  • @denyspetrushkov5854
    @denyspetrushkov5854 5 месяцев назад

    интересно посмотреть блог со страницами разных категорий, пагинации, acf поля и другое

  • @СтасВохмянин-б2ч
    @СтасВохмянин-б2ч 8 месяцев назад

    Хорошая тема, делал также год назад сайт на чистом React с вордпрессом. Освети еще тему деплоя на реальный сервер, поскольку есть разные способы запуска проекта, в ру-сегменте не смог найти, пришлось курить английские и индийские видео)

  • @dveleoperbek1349
    @dveleoperbek1349 10 месяцев назад +1

    давайте еще подробнее и с нуля на эту тему

  • @alexandermediantsev6354
    @alexandermediantsev6354 9 месяцев назад

    Да... и еще очень важный вопрос - как к SPA сайтам относятся поисковики? Ведь по своей сути - это же одностраничник!

  • @sunmoon2098
    @sunmoon2098 10 месяцев назад +3

    если все это надо делать на разних устройства ,с помощью апи то зачем тогда вордпрес в принципе!?

    • @bedeveloper
      @bedeveloper  10 месяцев назад +2

      Ну например чтобы не создавать админку отдельно. Иначе придется бэкэнд приложению писать ✍️

  • @denisk5606
    @denisk5606 9 месяцев назад

    Например смысл делать хедлес на вукомерс если там нужно много различных плагинов типа обработка ордеров, доставка какая-нибудь спецефичная еще что-то особое. По сути делать магазин на хедлес вордпрес это изобретать велосипед. Ну мне так кажется я не уверен.

  • @Wanderer311
    @Wanderer311 10 месяцев назад +4

    Спасибо, надо развивать эту тему!🇺🇦

  • @denisk5606
    @denisk5606 9 месяцев назад

    Просто фриланс это все таки CMS based рынок то есть там практически всегда нужна админка

  • @denisk5606
    @denisk5606 9 месяцев назад

    А на сколько популярен реакт на фрилансе? Мне кажется это больше к работе по контракту на долгий срок. Хедлес по срокам не имеет смысла так как на фрилансе нужно все быстро делать. Проще поставить шаблон и кастомизировать его, чем натягивать фронтенд реакт на вордпрес. Мог бы поделиться мнением с точки зрения фриланса и новые технологии.

  • @mr.alexsteel
    @mr.alexsteel 10 месяцев назад +2

    Инетересует использования в даном функционале graphql

  • @lafoerteaitishnik4793
    @lafoerteaitishnik4793 10 месяцев назад +1

    Пора переносить курсы на степик)

    • @bedeveloper
      @bedeveloper  10 месяцев назад

      Зачем они на степик если есть на моем сайте?)

    • @lafoerteaitishnik4793
      @lafoerteaitishnik4793 10 месяцев назад

      @@bedeveloper степик - популярная платформа, а про сайт мало кто знает)

  • @brokert3163
    @brokert3163 6 месяцев назад

    Ничего не понятно, но очень интересно

  • @servera-center
    @servera-center 10 месяцев назад +1

    а сделай тоже самое на modx

    • @bedeveloper
      @bedeveloper  10 месяцев назад +3

      зачем? я не использую эту cms

  • @duoduoo6732
    @duoduoo6732 5 месяцев назад

    раньше это назвыалось парсером сайтов

  • @michaelmurat5481
    @michaelmurat5481 5 месяцев назад

    гоу фулл сайт реакт + вп

  • @awenn2015
    @awenn2015 4 месяца назад

    Подача в целом хорошая но ощущение как будто автор либо совсем не хотел нагружать новичков либо сам плохо кодит
    1) название шаблонов пишется с большой буквы
    2) если работаешь с неизвестными данными используй typescript и пиши типы, туда же проверку данных через zod схему
    3) загружай данные через устоявшиеся либы в которых есть проверка на ошибки, состоянии загрузки и тд, например tunstack query
    4) не показан пример многостраничного сайта
    5) не объяснено что это лишь пример и реальные сайты не стоит писать на реакте, лучше использовать next что бы избежать проблем с SEO, если сайт чисто контентный можно использовать плагин для генерации HTML с "первым" контентом
    6) что бы не импортировать модули руками можно использовать плагин автоимпорта

  • @vinyardrip
    @vinyardrip 10 месяцев назад +1

    Регби в штатах?)) У них самое тру американский футбол аще-т.., Ну тип регби))

    • @bedeveloper
      @bedeveloper  10 месяцев назад +1

      Они футбол не хотят называть футболом и говорят ему соккер, по этому я их футбол называю рэгби)

  • @dmitriizharikov8266
    @dmitriizharikov8266 3 месяца назад

    Вы уверены , что вы разработчик и вы знаете все концепции реакта? Мне кажется , что вам бы не мешало почитать документацию для начала и понять что такое ключи, зависимости и принципы вызовов функций в том числе в рендере. А не нейминг.
    Сразу видно , что фрилансер и не малейшего понимания что вы делаете.

  • @A.Floatrx
    @A.Floatrx 10 месяцев назад +1

    Попытка натянуть сову на глобус! Погугли нормальные headless cms и попробуй юзать нормальное api, а не этот костыль…

    • @bedeveloper
      @bedeveloper  10 месяцев назад +1

      Запиши видео и покажи другую точку зрения, пожалуйста 🙏 мы оценим!

  • @виртуоз_ру
    @виртуоз_ру 10 месяцев назад +1

    Wordpress Api 👍

  • @drfaqqy2226
    @drfaqqy2226 10 месяцев назад +2

    Очень интересно!