اكتب كلمة ثم اضغط زر البحث.
تهيئة بيئة التطوير · Vibe Coding
حتى تبدأ مباشرة دون تأخير، حمّل البرامج والأدوات التالية على جهازك. هذه العملية تُسمّى «تهيئة بيئة التطوير» — اتبع الخطوات واحدة تلو الأخرى، وستكون جاهزاً للعمل من الدقيقة الأولى.
حدّدنا نظام جهازك تلقائياً — اضغط لتغييره وتتبدّل كل الخطوات والروابط:
تحتاج جهاز كمبيوتر: البرمجة تتطلّب جهاز لابتوب أو جهازاً مكتبياً بنظام تشغيل ويندوز أو ماك. لا يمكن التطوير على الهاتف المحمول أو التابلت.
للأعمار أقل من 18 سنة: بعض هذه الخدمات تشترط حدّاً أدنى للعمر، لذا يجب أن يقوم أحد الوالدين بإنشاء هذه الحسابات نيابةً عنك.
جهازك قديم؟ في حال لم يتم تحميل أيٍّ من البرامج التالية بسبب قِدَم الجهاز، فالرجاء تغيير جهازك والتأكد من عملها جميعاً عليه قبل الدورة.
التكاليف: كل الأدوات والحسابات في هذه الصفحة مجانية تماماً، ما عدا أمرين اختياريين قد تحتاجهما في مرحلة لاحقة: تسجيل اسم النطاق (Domain) بنحو 11 دولاراً سنوياً، و Laravel Cloud بـ 5 دولارات شهرياً.
شاهد أولاً
قبل أن تبدأ، تابع هذا الفيديو الذي يشرح خطوات تهيئة بيئة التطوير بشكل مسجّل خطوة بخطوة — ثم اتبع الخطوات المكتوبة بالأسفل.
الخطوة الأولى
حسابان مجانيان ستحتاجهما طوال الدورة. سجّل فيهما الآن قبل أي شيء.
منصّة المبرمجين لحفظ ومشاركة الأكواد
عليها نحفظ مشاريعنا وندخل بها إلى أدوات المطوّرين. أنشئ حساباً مجانياً بالبريد الإلكتروني.
سجّل في GitHubمساعدك الذكي عند أي مشكلة
لو واجهتك أي مشكلة في التثبيت، اعرضها على ChatGPT وسيرشدك خطوة بخطوة. ستجد زرّ «انسخ سؤال ChatGPT» في كل خطوة بالأسفل.
سجّل في ChatGPT
المتصفّح الذي سنعمل عليه ونعرض فيه مواقعنا أثناء الدورة. لو لم يكن مثبّتاً لديك، حمّله الآن.
انسخ السؤال التالي والصقه في ChatGPT ليساعدك خطوة بخطوة:
محرّر الأكواد الأساسي الذي ستكتب فيه برامجك. بعد تثبيته، ثبّت بداخله إضافة «Codex – OpenAI's coding agent».
بعد تثبيت VS Code: شغّله ← افتح قسم الإضافات (Extensions) من الشريط الجانبي ← ابحث عن Codex وثبّت إضافة OpenAI.
انسخ السؤال التالي والصقه في ChatGPT:
أداة تتبّع التغييرات في مشروعك وترفعه إلى GitHub. ضرورية للعمل مع الأكواد.
شغّل المثبّت واضغط Next على كل الخطوات (الإعدادات الافتراضية مناسبة).
Git مثبّت غالباً على ماك. للتأكد، افتح Terminal واكتب:
git --version
لو ظهر طلب تثبيت، نفّذ الأمر التالي ثم اقبل النافذة:
xcode-select --install
انسخ السؤال التالي والصقه في ChatGPT:
بيئة تشغيل Laravel جاهزة بنقرة واحدة — تثبّت PHP وكل ما تحتاجه لتشغيل أول موقع. شغّل المثبّت واتبع الخطوات بدون أي تغيير.
قبل الدورة: جرّب إنشاء أول موقع Laravel من داخل Herd حتى تكتمل التحميلات الأولى ولا تضيّع وقتاً يوم الدورة.
دليل Herd: إنشاء أول موقع ←انسخ السؤال التالي والصقه في ChatGPT:
معظم التطبيقات تحفظ بياناتها في قاعدة بيانات. في هذه الخطوة نُثبّت ونشغّل خادم MySQL على جهازك، وفي الخطوة التالية نضيف phpMyAdmin لإدارته بصرياً.
تثبيت وتشغيل خادم MySQL
ملاحظة — رابط تحميل مباشر دون الحاجة للتسجيل:
mysql-installer-web-community-8.0.46.0.msiتثبيت وتشغيل خادم MySQL
ثبّته ثم شغّله عبر Terminal:
brew install mysql
brew services start mysql
تذكّر: احفظ اسم المستخدم root وكلمة المرور التي تضبطها الآن — ستحتاجهما لتسجيل الدخول في phpMyAdmin بالخطوة التالية.
انسخ السؤال التالي والصقه في ChatGPT:
أداة ويب مجانية لإدارة MySQL من المتصفّح. سنحمّلها كملف مضغوط ونفكّ ضغطه داخل مجلد Herd ليتحوّل تلقائياً إلى موقع يعمل على جهازك.
1) فُكّ ضغط الملف
بعد التحميل، استخرج محتوى الملف المضغوط. ستحصل على مجلد باسم طويل مثل phpMyAdmin-5.2.3-all-languages — أعِد تسميته إلى phpmyadmin ليكون الرابط أقصر وأسهل.
2) ضَع المجلد داخل مجلد Herd
انقل مجلد phpmyadmin إلى مجلد Herd في جهازك:
C:\Users\اسمك\Herd\phpmyadmin
~/Herd/phpmyadmin
Herd يحوّل أي مجلد بداخله تلقائياً إلى موقع باسم المجلد.test — تأكّد أن مجلد Herd هذا مُضاف ضمن المجلدات المُراقَبة (Parked) في إعدادات Herd.
3) افتح phpMyAdmin وسجّل الدخول
افتح العنوان التالي في المتصفّح، وسجّل الدخول باسم المستخدم root وكلمة مرور MySQL من الخطوة السابقة:
https://phpmyadmin.testبديل (اختياري): تفضّل أداة سطح مكتب بدل المتصفّح؟ يمكنك استخدام DBeaver المجاني.
تحميل DBeaver ←انسخ السؤال التالي والصقه في ChatGPT:
وكيل ذكي يكتب وينفّذ الأكواد معك — هو جوهر أسلوب Vibe Coding الذي ستتعلّمه.
عند الإعداد: اختر «Set up Agent sandbox to continue» لتفعيل صندوق الوكيل وإكمال التهيئة.
لماذا Codex تحديداً؟ لأنه يتيح لك تجربة البرمجة وتشغيل الأكواد مجاناً للبدء — بخلاف بعض الأدوات الأخرى مثل Claude التي تتطلّب اشتراكاً مدفوعاً.
بعد الدورة: ستصل إلى حدود الاستخدام المجاني بعد فترة، وقد تحتاج حينها إلى نسخة مدفوعة من Codex للاستمرار.
بديل مجاني: سنثبّت أيضاً OpenCode — وكيل مفتوح المصدر بلا قيود — في الخطوة التالية لتجرّب أكثر من وكيل.
انتقل إلى خطوة OpenCode ↓انسخ السؤال التالي والصقه في ChatGPT:
وكيل ذكي مفتوح المصدر يعمل في الطرفية وداخل المحرّر — مجاني وبلا قيود، نثبّته بجانب Codex لتجرّب أكثر من وكيل في أسلوب Vibe Coding.
تتوفّر نسخة سطح مكتب ونسخة طرفية لكلٍّ من ويندوز وماك — حمّل المناسبة لجهازك وشغّل المثبّت.
بعد تثبيت OpenCode: ثبّت إضافة OpenCode داخل VS Code — افتح قسم الإضافات (Extensions) من الشريط الجانبي ← ابحث عن OpenCode ← اضغط Install. أو شغّل الأمر opencode داخل طرفية VS Code وستُثبَّت الإضافة تلقائياً.
تتيح لك الإضافة تشغيل الوكيل داخل المحرّر بضغطة Ctrl/Cmd + Esc ومشاركة الكود المحدّد معه مباشرة.
انسخ السؤال التالي والصقه في ChatGPT:
Ollama يتيح لك تحميل وتشغيل نماذج ذكاء اصطناعي مفتوحة المصدر على جهازك مباشرة — يعمل بالكامل بدون إنترنت وتبقى بياناتك محلية على جهازك دون إرسالها لأي خادم. مفيد إن أردت وكيلاً يعمل دون اشتراك أو اتصال.
قبل التحميل — متطلّبات مهمّة:
💾 مساحة كبيرة على القرص الصلب: تحميل النماذج للعمل بدون إنترنت يستهلك مساحة كبيرة من الهاردديسك — كل نموذج عدة جيجابايت (نموذج صغير ≈ 4–5 GB، والأكبر قد يصل إلى عشرات الجيجابايت).
🧠 ذاكرة (RAM) كبيرة: يحتاج جهازاً بذاكرة كبيرة — 8 GB كحدّ أدنى للنماذج الصغيرة، و16 GB أو أكثر لأداء مريح.
🎮 يُفضّل جهاز بمعالج رسومات (GPU): يعمل بدون GPU لكن ببطء — جهاز يحوي كرت شاشة (GPU) أو جهاز Mac بمعالج Apple Silicon يجعل الوكيل المحلي سريعاً وقابلاً للاستخدام فعلياً.
بعد التثبيت، نزّل أول نموذج وشغّله من الطرفية:
ollama run llama3.2
يُحمّل النموذج أول مرة فقط (قد يستغرق وقتاً حسب سرعة الإنترنت وحجم النموذج)، ثم يعمل بعدها بدون إنترنت.
اربطه بمحرّر VS Code عبر إضافة Continue: افتح قسم الإضافات (Extensions) من الشريط الجانبي ← ابحث عن Continue ← اضغط Install.
عند أول تشغيل سيظهر معالج إعداد — اختر خيار «Local» وسيتعرّف على نماذج Ollama المثبّتة لديك تلقائياً. بعدها تحادث الوكيل المحلي داخل المحرّر بضغطة Ctrl/Cmd + L مع وضع الوكيل (Agent) لتعديل الكود — كل ذلك بدون إنترنت.
انسخ السؤال التالي والصقه في ChatGPT:
سطر أوامر حديث لأجهزة ويندوز يسهّل تشغيل الأدوات. اختياري لكنه مفيد.
اختر ملف x64 .msi لمعظم أجهزة ويندوز.
قسم اختياري
بعد الدورةعندما يصبح موقعك جاهزاً وتريد نشره ليراه العالم، ستحتاج إلى خدمة تربط موقعك بالإنترنت واسم نطاق خاص بك. هذه خطوات اختيارية لما بعد الدورة.
رفع الموقع وحمايته وتسريعه
أنشئ حساباً مجانياً في Cloudflare لرفع موقعك على الإنترنت وحمايته وتسريعه، ثم ربط اسم النطاق به.
انسخ السؤال التالي والصقه في ChatGPT:
عنوان موقعك مثل yoursite.com
احجز اسم نطاق خاصاً بموقعك عبر Cloudflare، ثم اربطه بموقعك.
انسخ السؤال التالي والصقه في ChatGPT:
لمزايا النشر والإدارة المتقدّمة
أنشئ حساباً في Laravel Cloud لتفعيل مزايا النشر والإدارة الإضافية. اختياري — سجّل لاحقاً متى احتجت.
انسخ السؤال التالي والصقه في ChatGPT:
قاعدة ذهبية
في حال واجهت أي مشكلة أثناء التثبيت، افتح ChatGPT واعرض مشكلتك عليه. مثال جاهز:
«أود تركيب https://herd.laravel.com/ على جهازي، ساعدني خطوة بخطوة.»
بعد إكمال كل الخطوات أعلاه، تكون بيئتك التطويرية مهيّأة بالكامل وتستطيع البدء مباشرة دون أي تأخير. نراك في الدورة 🚀
الصورة الكاملة
هذه هي الرحلة الكاملة التي ستسلكها مع البرمجة بأسلوب Vibe Coding — وتهيئة هذه الصفحة هي أول خطوة فيها.
حمّلت الأدوات وأنشأت الحسابات على جهازك — كل ما في هذه الصفحة.
تبني تطبيقك بأسلوب Vibe Coding داخل VS Code مع وكيل Codex.
تحفظ تغييراتك وترفع مشروعك إلى مستودع على GitHub.
ترفع تطبيقك على خادم/استضافة ليعمل على الإنترنت ويراه الجميع.
تربط تطبيقك باسم نطاقك الخاص عبر Cloudflare.
تدير تطبيقك، تضيف الميزات، وتطوّره باستمرار اعتماداً على ملاحظات المستخدمين.