"إذا أراد العامل أن يؤدي عمله بشكل جيد، فعليه أولاً أن يشحذ أدواته." - كونفوشيوس، "مختارات كونفوشيوس. لو لينجونج"
الصفحة الأمامية > برمجة > بناء التجارة الإلكترونية باستخدام Next.js

بناء التجارة الإلكترونية باستخدام Next.js

تم النشر بتاريخ 2024-10-31
تصفح:222

Building eCommerce with Next.js

باعتباري مطورًا، لا أريد أن أكون مقيدًا بقالب Shopify، ولكن أيضًا لا أريد استخدام واجهة برمجة تطبيقات واجهة المتجر الخاصة بهم مع تطبيق مخصص. أريد أن يكون لدي حل قابل للتخصيص بالكامل ويمكنني ضبطه بالطريقة التي أريدها. من ui/ux، وdb، والواجهة الخلفية، وapi، والمصادقة، وdevops، وما إلى ذلك. لذلك، قمت ببناء حل قابل للتخصيص بالكامل باستخدام React وNext.js وMongoDB وStripe للمدفوعات.

يمكنك العثور على الرابط التجريبي هنا: https://wexcommerce.dynv6.net:8002

وكود المصدر هنا: https://github.com/aelassas/wexcommerce

باستخدام الحل التالي، يمكنك إنشاء موقع ويب للتجارة الإلكترونية قابل للتخصيص بالكامل ومُحسّن لتحسين محركات البحث باستخدام بوابة دفع Stripe تشغيلية بتكلفة منخفضة جدًا من خلال استضافته على Docker Droplet مع 1 جيجابايت على الأقل من ذاكرة الوصول العشوائي.

يتكون هذا الحل من واجهة أمامية ولوحة تحكم إدارية. من الواجهة الأمامية، يمكن للعملاء البحث عن المنتجات التي يريدونها وإضافتها إلى سلة التسوق الخاصة بهم والخروج. يمكن للعملاء الاشتراك في Google أو Facebook أو Apple أو البريد الإلكتروني والدفع باستخدام بطاقة الائتمان أو الدفع عند الاستلام أو التحويل البنكي أو PayPal أو Google Pay أو Apple Pay أو Link أو طرق الدفع الأخرى من Stripe. بمجرد تسجيل الدخول، يمكنهم الوصول إلى تاريخ مشترياتهم ومتابعة طلباتهم. من لوحة تحكم المشرف، يمكن للمسؤولين إدارة الطلبات والمدفوعات والمنتجات والفئات والعملاء والإعدادات العامة مثل اللغة الافتراضية والعملة والتسليم والشحن وطرق الدفع المقبولة.

تم اتخاذ قرار تصميمي رئيسي لاستخدام TypeScript نظرًا لمزاياه العديدة. يوفر TypeScript كتابة وأدوات وتكاملًا قويًا، مما ينتج عنه تعليمات برمجية عالية الجودة وقابلة للتطوير وأكثر قابلية للقراءة والصيانة، كما يسهل تصحيح الأخطاء والاختبار.

سمات

  • إدارة المخزون
  • إدارة الطلبات
  • إدارة الدفع
  • إدارة العملاء
  • خيارات دفع متعددة (بطاقة الائتمان، الدفع عند الاستلام، التحويل البنكي، PayPal، Google Pay، Apple Pay، Link)
  • بوابة الدفع الشريطية التشغيلية
  • خيارات توصيل متعددة (التوصيل إلى المنزل، السحب من المتجر)
  • دعم متعدد اللغات (الإنجليزية والفرنسية)
  • خيارات تسجيل دخول متعددة (جوجل، فيسبوك، أبل، البريد الإلكتروني)
  • الواجهة الخلفية والواجهة الأمامية سريعة الاستجابة

موارد

  1. ملخص
  2. التثبيت (استضافة ذاتية)
  3. التثبيت (دوكر)
    1. صورة عامل الميناء
    2. طبقة المقابس الآمنة
  4. شريط الإعداد
  5. التشغيل من المصدر
  6. قاعدة البيانات التجريبية
    1. أنظمة التشغيل Windows وLinux وMac
    2. عامل ميناء
  7. تغيير اللغة والعملة
  8. إضافة لغة جديدة
  9. السجلات

نقدر أي تعليقات.

بيان الافراج تم نشر هذه المقالة على: https://dev.to/aelassas/building-ecommerce-with-nextjs-3aa4?1 إذا كان هناك أي انتهاك، يرجى الاتصال بـ [email protected] لحذفه
أحدث البرنامج التعليمي أكثر>

تنصل: جميع الموارد المقدمة هي جزئيًا من الإنترنت. إذا كان هناك أي انتهاك لحقوق الطبع والنشر الخاصة بك أو الحقوق والمصالح الأخرى، فيرجى توضيح الأسباب التفصيلية وتقديم دليل على حقوق الطبع والنشر أو الحقوق والمصالح ثم إرسالها إلى البريد الإلكتروني: [email protected]. سوف نتعامل مع الأمر لك في أقرب وقت ممكن.

Copyright© 2022 湘ICP备2022001581号-3