nextjs woocommerce restapi

? Next.js WooCommerce REST API

• React Woocommerce Тема, используя отделенную архитектуру в next.js
• Бэкэнд в WordPress
• Передний конец в React.
• Данные получают через API REST.

Функции

• Домашняя страница
• Одиночная страница продукта с галереей Carousel.
• КОРТА СТРАНИЦА
• Страница заказа с интеграцией платежного шлюза Stripe.
• REST API конечные точки.
• Заголовок и нижний колонтитул в next.js, получая из пунктов меню WordPress.
• Виджеты WordPress отображаются на Frontend Next.js.
• Название сайта, слоган, текст авторских прав, социальные ссылки, полученные из WordPress.
• Yoast SEO поддержка
• Следующая компонент изображения, который имеет оптимизацию изображения во время запроса
• ИНКРЕМЕНТАЛЬНАЯ СТАТИЧЕСКАЯ (RE) генерация и автоматическое создание новых страниц статических продуктов без необходимости повторного строительства Next.js приложения.
• Гутенберг Стили поддержка
• Страница блога с страницей
• Одиночный пост
• Страницы
• 404 страница
• Отображать комментарии
• Разместите комментарий (используя форму комментария)
• Предварительный просмотр (скоро наступит)
• Паренье из продукта (скоро наступит)
• Загрузить больше продуктов (скоро)
• Аутентификация с реализацией JWT и HTTP. ( Вскоре )
• Функция входа для предварительного просмотра WP Post в next.js (скоро)

Учебный курс

Live Demo Link

Настраивать

Сначала клон/разветвляется репо и компакт -диск в него.

git clone https://github.com/imranhsayed/nextjs-woocommerce-restapi.git
cd nextjs-woocommerce-restapi
npm ci
npm run dev

Добавить безголовные функции для WordPress

• Установите и активируйте следующие плагины WordPress:

• без головы CMS
• Woocommerce

Конфигурация?

1. (Требуется) Создайте файл .env , принимающий ссылки из .env-example и обновите URL WordPressSite и Frontend Next.js URL.

• NEXT_PUBLIC_WORDPRESS_URL=https://example.com
• NEXT_PUBLIC_SITE_URL=http://localhost.com (это будет ваш фронт.

2. Добавьте свой WC_CONSUMER_KEY и WC_CONSUMER_SECRET в .env , следуя Woocommerce> Настройки> Advanced> REST API

3. В вашей панели инструментов WordPress перейдите к настройкам> Общий> Адрес сайта (URL) (установите это на URL -адрес, например, http: // localhost: 3000 во время разработки)

4. Создайте меню заголовка и нижнего колонтитула на панели WordPress и установите их в меню заголовка HCMS и меню нижнего колонтитула HCMS соответственно.

Полезные ссылки

• Полоса
• Получение клавиш API полосы

Версия?

Я использую git для управления версиями.

Автор?

• Имран Сайед

Лицензия?

Этот проект лицензирован по лицензии MIT - для получения подробной информации см.