nextjs woocommerce restapi

؟ next.js woocommerce rest API

• React WooCommerce موضوع ، باستخدام العمارة المنفصلة في Next.js
• الخلفية في WordPress
• الواجهة الأمامية في رد الفعل.
• يتم جلب البيانات من خلال REST API.

سمات

• الصفحة الرئيسية
• صفحة منتج واحد مع معرض carousel.
• صفحة العربة
• صفحة الخروج مع تكامل بوابة الدفع الشريط.
• REST API endpoints.
• رأس وتذييل في Next.js يجلبون من عناصر قائمة WordPress.
• WordPress Widgets المعروضة على الواجهة الأمامية Next.js.
• عنوان الموقع ، سطر الوصف ، نص حقوق الطبع والنشر ، الروابط الاجتماعية المصدر من WordPress.
• yoast SEO دعم
• مكون صورة next.js ، يحتوي على تحسين الصورة في وقت الطلب
• توليد ثابت (Re) الثابت (Re) والإنشاء التلقائي لصفحات منتجات ثابتة جديدة دون الحاجة إلى إعادة بناء التطبيق التالي.
• دعم أنماط غوتنبرغ
• صفحة المدونة مع ترقيم الصفحات
• وظيفة واحدة
• الصفحات
• 404 صفحة
• عرض التعليقات
• انشر تعليق (باستخدام نموذج التعليق)
• Post Preview (قريبًا)
• ترقيم ترقيم المنتج (قريبا)
• تحميل المزيد من المنتجات (قريبا)
• المصادقة مع JWT و HTTP فقط تطبيق ملفات تعريف الارتباط. ( قريباً )
• ميزة تسجيل الدخول لـ WP Post Preview في Next.js (قريبًا)

دورة تعليمية

الرابط التجريبي المباشر

يثبت

أول استنساخ/شوكة الريبو والقرص المضغوط فيه.

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 و URL EXTROM.JS.

• NEXT_PUBLIC_WORDPRESS_URL=https://example.com
• NEXT_PUBLIC_SITE_URL=http://localhost.com (سيكون هذا هو عنوان URL الخاص بك

2. .env WC_CONSUMER_KEY و WC_CONSUMER_SECRET

3. في لوحة معلومات WordPress الخاصة بك ، انتقل إلى الإعدادات> عام> عنوان الموقع (url) (اضبط هذا على عنوان URL للواجهة الأمامية على سبيل المثال http: // localhost: 3000 أثناء التطوير)

4. قم بإنشاء قوائم رأس وتذييل في لوحة معلومات WordPress وقم بتعيينها على قائمة HCMS Header وقائمة تذييل HCMS على التوالي.

روابط مفيدة

• شريط
• الحصول على مفاتيح واجهة برمجة تطبيقات الشريط

الإصدار؟

أنا استخدم git للإصدار.

مؤلف ؟

• قال عمران

رخصة ؟

تم ترخيص هذا المشروع بموجب ترخيص معهد ماساتشوستس للتكنولوجيا - راجع ملف الترخيص.