> ## Documentation Index
> Fetch the complete documentation index at: https://ayakaleaf-pro.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# إعداد بيئة التطوير (Codespace)

> أعدّ بيئة التطوير الخاصة بك باستخدام GitHub Codespace.

لتوفير الوقت وبناء بيئة التطوير بسرعة، نوفّر إصدارًا آخر من إعدادات بيئة التطوير، وهو GitHub Codespace.

## دليل الإعداد

<Steps>
  <Step title="إنشاء Codespaces">
    انقر على الزر التالي لإنشاء codespace سحابية لتطوير server-pro.

    [![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/ayaka-notes/overleaf-pro)

    يُنصح باختيار **نوع جهاز (Machine Type)** بـ **4 أنوية** على الأقل. للحصول على أنواع أجهزة أكبر، يمكنك تقديم طلب إلى فريق الدعم الرسمي لـ GitHub عبر فتح تذكرة [من هنا](https://support.github.com/contact?tags=rr-codespaces%2Ccat_codespaces).

    <Frame>
      <img src="https://mintcdn.com/ayakaleaf-pro/x9kfDjtWlyyhG_mR/images/dev/image.png?fit=max&auto=format&n=x9kfDjtWlyyhG_mR&q=85&s=d723c8474a8fe076724ad4b8404c90a0" alt="" width="1319" height="990" data-path="images/dev/image.png" />
    </Frame>
  </Step>

  <Step title="تشغيل سكربت الإعداد">
    ستحتاج إلى الانتظار بصبر حتى يتم إنشاء الـ codespace. بعد أن تتمكن من الوصول إلى الطرفية (Terminal)، شغّل الأمر التالي:

    ```text theme={null}
    cd develop/
    bin/setup
    ```

    <Frame>
      <img src="https://mintcdn.com/ayakaleaf-pro/x9kfDjtWlyyhG_mR/images/dev/image-1.png?fit=max&auto=format&n=x9kfDjtWlyyhG_mR&q=85&s=67fe318b5d049b5eb8317b41154ca3b4" alt="" width="1086" height="587" data-path="images/dev/image-1.png" />
    </Frame>

    <Warning>
      يتيح لك هذا السكربت (`bin/setup`) إعداد بيئة التطوير على أحدث commit في الفرع `server-pro` في أقصر وقت ممكن. وقد لا يكون مناسبًا للإصدارات الأقدم أو الفروع الأخرى.

      نقوم ببناء صورة Docker الخاصة بالتطوير يوميًا باستخدام [GitHub Action](https://github.com/ayaka-notes/overleaf-pro/actions).
    </Warning>
  </Step>

  <Step title="الوصول إلى Launchpad">
    انتقل إلى تبويب المنافذ (Ports)، وسترى قائمة بمنافذ الويب المتاحة. انقر على المنفذ `80`. من المفترض أن ترى صفحة launchpad الآن.

    <Frame>
      <img src="https://mintcdn.com/ayakaleaf-pro/x9kfDjtWlyyhG_mR/images/dev/image-2.png?fit=max&auto=format&n=x9kfDjtWlyyhG_mR&q=85&s=649782162b3038fde73e6b9c3be0a5ce" alt="" width="1492" height="589" data-path="images/dev/image-2.png" />
    </Frame>

    سترى:

    <Frame>
      <img src="https://mintcdn.com/ayakaleaf-pro/x9kfDjtWlyyhG_mR/images/dev/image-3.png?fit=max&auto=format&n=x9kfDjtWlyyhG_mR&q=85&s=2cb7a394e9e4724a2145f5a631447237" alt="" width="1742" height="1183" data-path="images/dev/image-3.png" />
    </Frame>
  </Step>

  <Step title="استمتع بالتطوير">
    حان الآن وقتك! ابدأ ببناء ميزتك الرائعة. ستحتاج إلى تشغيل الأمر التالي لتفعيل العرض الفوري:

    ```bash title="bash" wrap theme={null}
    docker compose -f docker-compose.yml -f docker-compose.dev.yml -f ./docker-compose.image.yml up --no-deps --detach
    ```
  </Step>
</Steps>


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.