# 1 · Cloudflare Pages: انشر موقعك للعالم 🌍

> ملف مراجعة من ورشة «من جهازك إلى العالم» · مجتمع الـ Vibe Coding

---

## الفكرة ببساطة

رسمت لوحة جميلة (موقعك)، و Pages معرض عالمي يعلّقها ويستقبل الزوار من كل مكان، مجانًا وبسرعة خيالية.

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

**المشكلة التي تحلّها:** موقعك الذي بنيته بالذكاء الاصطناعي يعيش على جهازك فقط. Pages تنقله إلى الإنترنت برابط حقيقي تشاركه مع أي أحد.

---

## ماذا تحصل مجانًا؟

| الميزة | الخطة المجانية |
|---|---|
| الزيارات (Bandwidth) | **بلا حدود**، لو انتشر موقعك ما تدفع شيئًا |
| عمليات النشر (Builds) | 500 عملية شهريًا |
| عدد الملفات | حتى 20,000 ملف لكل موقع |
| حجم الملف الواحد | حتى 25 ميجابايت |
| شهادة الأمان HTTPS | تلقائية ومجانية |
| دومين خاص | مدعوم، تربطه بضغطات معدودة |
| عدد المشاريع | حتى 100 مشروع |

> **النقطة الأهم:** «الزيارات بلا حدود» تعني أنك لن تستيقظ على فاتورة لأن مشروعك انتشر. هذا نادر، وهو السبب الأول لاختيار Pages.

---

## الطريقة الأولى: سحب وإفلات (الأسهل)

1. سجّل حسابًا مجانيًا في `dash.cloudflare.com`
2. من القائمة اختر **Workers & Pages** ثم **Create** ثم تبويب **Pages**
3. اختر **Upload assets** واسحب مجلد موقعك، أي المجلد الذي فيه ملف `index.html`
4. اختر اسمًا لمشروعك… وخلال ثوانٍ موقعك حي على الإنترنت 🎉

سيصير رابطك بهذا الشكل:

```
mashroo3i.pages.dev
```

**شرط واحد فقط:** لازم يكون في المجلد ملف اسمه `index.html` بالضبط. هذا الملف هو الصفحة الرئيسية.

---

## الطريقة الثانية: الربط مع GitHub (للي يعدّل كثير)

1. ارفع مشروعك إلى مستودع (repo) على GitHub. اطلب من أداتك المفضلة تساعدك
2. في Pages اختر **Connect to Git** واربط المستودع
3. من الآن فصاعدًا: **كل تعديل ترفعه إلى GitHub يُنشر تلقائيًا**، بدون أي خطوة إضافية
4. ميزة ذهبية: كل تعديل تجريبي يأخذ **رابط معاينة (Preview URL)** خاصًا به، تشاركه قبل ما تعتمد التغيير

متى تختار هذه الطريقة؟ إذا كنت تعدّل على مشروعك أكثر من مرة في الأسبوع. غير ذلك، السحب والإفلات أسرع وأبسط.

---

## ربط دومينك الخاص

لو اشتريت دومينًا (مثل `ahmed.sa`) وتبي موقعك عليه بدل `pages.dev`:

1. من صفحة مشروعك اختر **Custom domains** ثم **Set up a domain**
2. اكتب الدومين
3. كلاودفلير تعطيك سجلات DNS. أضفها عند الجهة التي اشتريت منها الدومين
4. انتظر دقائق… وشهادة HTTPS تجيك تلقائيًا ومجانًا

---

## جُمل جاهزة تقولها لأداتك

> «جهّز مشروعي للنشر على Cloudflare Pages، وتأكد أن ملف `index.html` في جذر المجلد»

> «كل الروابط في موقعي لازم تكون نسبية (relative) عشان تشتغل على Pages»

> «سوِّ لي ملف `_redirects` يحوّل كل الروابط غير الموجودة إلى الصفحة الرئيسية»

---

## أخطاء شائعة وحلولها

- **الموقع يفتح صفحة بيضاء** ← تأكد أن `index.html` في جذر المجلد، مو داخل مجلد فرعي
- **الصور ما تظهر** ← الروابط لازم تكون نسبية: `images/pic.png` وليس `/Users/…/pic.png`
- **التعديل ما ظهر** ← امسح ذاكرة المتصفح (Hard Refresh)، أو انتظر دقيقة

> **القاعدة الذهبية:** أي رسالة خطأ انسخها كاملة والصقها في أداتك المفضلة واطلب الحل.

---

## روابط

- لوحة التحكم: `dash.cloudflare.com`
- الصفحة الرسمية: `pages.cloudflare.com`
- التوثيق: `developers.cloudflare.com/pages`