gpt-engineer-app[bot] ba4437e4b6 Save plan in Lovable
2026-03-29 15:26:58 +00:00

2.1 KiB

خطة بناء موقع FXCraft

موقع عربي لإضافات ماين كرافت بتصميم داكن مع ألوان مستوحاة من ماين كرافت.

الهيكل العام

الصفحة الرئيسية (/) → عرض الإضافات المميزة + بحث
صفحة الإضافة (/mod/:id) → تفاصيل + تحميل
صفحة البحث (/search) → بحث متقدم + تصفية

التصميم

  • اتجاه RTL بالكامل، خط عربي (Cairo من Google Fonts)
  • ثيم داكن مع لون أخضر ماين كرافت (#4CAF50) كلون أساسي
  • خلفية داكنة (#1a1a2e)

المكونات الرئيسية

  1. Navbar — شعار FXCraft + روابط + بحث
  2. HeroSection — بانر ترحيبي
  3. ModCard — بطاقة عرض الإضافة (صورة، اسم، وصف، تحميلات)
  4. ModGrid — شبكة عرض الإضافات
  5. ModDetails — صفحة تفاصيل الإضافة مع إصدارات التحميل
  6. SearchBar — بحث مع فلاتر (تصنيف، إصدار اللعبة)
  7. Footer — تذييل الموقع

Backend (Lovable Cloud)

  • Edge Function: fetch-mods — تجلب الإضافات من Modrinth API باستخدام الـ API key (يُخزن كـ secret)
    • GET /search — بحث عن إضافات
    • GET /project/{id} — تفاصيل إضافة
    • GET /project/{id}/version — إصدارات التحميل
    • GET /user/{username}/projects — إضافات المستخدم fxfelixzero
  • الـ API key يُحفظ كـ runtime secret باسم MODRINTH_API_KEY

الخطوات

  1. حفظ الـ API key كـ secret في المشروع
  2. تحديث الثيم والخطوط (index.css + index.html) لدعم RTL والتصميم الداكن
  3. إنشاء Edge Function fetch-mods للتواصل مع Modrinth API
  4. بناء الصفحة الرئيسية مع عرض إضافات المستخدم fxfelixzero
  5. بناء صفحة تفاصيل الإضافة مع روابط التحميل
  6. بناء صفحة البحث مع الفلاتر
  7. إضافة التنقل بين الصفحات