متجر إلكتروني — المكملات الطبيعية

NATSUP

دليل ومتجر شامل للمكملات الطبيعية يقدّم معلومات المنتجات وأسعارها وروابط الشراء الرسمية، بواجهة متعددة اللغات.

NATSUP زيارة الموقع المباشر

عن المشروع

NATSUP دليل ومتجر رقمي متخصص في المكملات الطبيعية، بُني لخدمة المهتمين بالصحة واللياقة: يقدّم مراجعات مبسطة وواضحة للمكملات، مكوناتها وفوائدها وأسعارها، مع روابط شراء رسمية موثوقة لكل منتج. الواجهة متعددة اللغات وتغطي منتجات عالمية مشهورة، والهدف جعل قرار الشراء واعياً وآمناً ومدروساً.

القيمة المضافة

NATSUP ليس مجرد موقع منتجات، بل أداة قرار قبل الشراء:

معلومات واضحة قبل الشراء

مراجعات مبسطة للمكملات: المكونات والفوائد والأسعار في مكان واحد، بلا حيرة.

ست لغات في واجهة واحدة

المحتوى متاح بالإنجليزية والعربية والفرنسية والإسبانية والإيطالية والألمانية — انفتاح حقيقي على جمهور عالمي.

روابط شراء رسمية

كل منتج يحيل على مصدر شراء رسمي موثوق، ما يحمي الزائر من الروابط المشبوهة.

بنية قابلة للنمو

كتالوج مبني على بيانات منظمة (JSON) يمكن توسيعه بمئات المنتجات دون إعادة بناء.

المجهود المبذول في البناء

بُني المشروع على مراحل: تنظيم بيانات المنتجات وترجمتها إلى ست لغات، بناء محرك الترجمة، تصميم واجهة متوافقة مع الهاتف، ثم التحسين لمحركات البحث. كل صفحة مرّت مراجعةً للمحتوى والترجمة قبل النشر، والعمل امتد على أسابيع بالتوازي مع تعلمي اليومي.

لغات الواجهة
6
أساس البناء
بيانات JSON منظمة
التحسين
SEO متكامل

التقنيات المستخدمة

للبناء

  • HTML5
  • CSS3
  • JavaScript
  • نظام ترجمة متعدد اللغات
  • طبقة بيانات منظمة (JSON)
  • تحسين محركات البحث (SEO)
  • Cloudflare Pages

للتشغيل والاستمرارية

  • Cloudflare Pages (استضافة مجانية)
  • شبكة CDN عالمية
  • شهادة SSL تلقائية
  • نشر عبر Wrangler
  • نطاق pages.dev مجاني

الأدوات والمهارات — بشرح مبسط

كل أداة ومكتبة ومهارة استعملتها في هذا المشروع، مشروحة بلغة بسيطة: ما هي، وماذا أضافت له تحديداً — بلا رموز غامضة.

HTML5

لغة بناء صفحات الويب الأساسية: تحدد هيكل كل صفحة — العناوين والصور والروابط والأزرار. هي الأساس الذي يقف عليه كل شيء آخر، كهيكل المبنى قبل الدهان.

CSS3

لغة التنسيق التي تمنح الصفحات شكلها النهائي: الألوان والخطوط والتباعد وتجاوب الهاتف. هي الفرق بين صفحة رمادية بلا روح وواجهة مريحة للعين.

JavaScript

لغة التفاعل داخل المتصفح: تنقل الموقع من عرض ثابت إلى تجربة حية — بحث فوري، فرز المنتجات، وتبديل اللغة دون إعادة تحميل الصفحة.

محرك الترجمة متعدد اللغات

كود كتبتُه يخزن نصوص الموقع في ست لغات ويبدّلها فورياً حسب اختيار الزائر — بدل بناء ستة مواقع منفصلة، موقع واحد يخدم الجميع.

طبقة البيانات JSON

ملفات منظمة تحفظ المنتجات والأسعار والمكونات بشكل مرتب ومقروء؛ أضيف منتجاً جديداً بتعديل الملف فقط دون لمس تصميم الصفحة.

تحسين محركات البحث (SEO)

عناوين وأوصاف دقيقة لكل صفحة حتى يجدها الباحث في Google من أول محاولة — الزائر المجاني الذي لا يُشترى بالإعلانات.

إدارة روابط الشراء (Affiliate)

ملف واحد يجمع روابط الشراء الرسمية: موثوقة ومحدثة ومفصولة عن المحتوى — حماية للزائر من الروابط المشبوهة وسهولة في التحديث.

Cloudflare Pages

الاستضافة: شبكة عالمية توزع الموقع على مئات الخوادم حول العالم مجاناً، فيفتح بسرعة من أي بلد ومعه شهادة أمان SSL تلقائية.

أبرز الميزات

  • كتالوج منتجات بالصور والمكونات والأسعار
  • روابط شراء رسمية موثوقة
  • واجهة متعددة اللغات
  • محتوى توعوي منظم
  • تصميم متوافق مع الهاتف

التكلفة التقديرية

إنشاء مشروع مماثل

بمسار ذاتي (ما فعلته فعلاً)0 درهم — استضافة ونطاق فرعي مجانيان؛ الاستثمار الحقيقي كان وقتي وتعلّمي.
عبر مستقل أو مكتب بالمغرب (تقدير)4,000 – 12,000 درهم تقريباً لموقع كتالوج متعدد اللغات بهذا الحجم.

التسيير والتشغيل

الوضع الحالي0 درهم شهرياً — يعمل ضمن باقة Cloudflare Pages المجانية.
عند التوسع (تقدير)نطاق خاص: نحو 100 – 150 درهم سنوياً، مع خدمات مدفوعة اختيارية عند الحاجة (نحو 50 درهم شهرياً).

أرقام إرشادية تقديرية بالدرهم المغربي (MAD)، تختلف حسب الحجم والمتطلبات الدقيقة وسوق الخدمات. مشاريعي الحالية مبنية وتعمل ضمن الباقات المجانية.

ماذا تعلّمت منه

علّمني هذا المشروع كيف تُبنى بنية محتوى كبيرة ومنظمة — بيانات وترجمة وعرض — وكيف تُدار روابط الشراء والتتبع بشكل نظيف، وأهمية الوضوح والصدق في بناء الثقة مع الزائر.