نظرة عامة على StackBlitz
StackBlitz ضمن قسم البرمجة. وصف البطاقة أعلاه من الدليل، ومقدمة القسم الطويلة تبقى في صفحة القسم حتى لا تتكرر على كل أداة.
بقلم فريق كيف؟
آخر تحديث: 25 أكتوبر 2026 · سياسة التحرير
ستاك بلتز يُفتح على مشروع صغير تنفّذه أنت قبل أن تتركه مفتوحًا
البطاقة تصف StackBlitz كبيئة برمجة في المتصفح. الصفحة لتجربة قصيرة: ملف، وأمر تشغيل، ونتيجة تراها. ليست لاستضافة خدمة عليها مفاتيح حقيقية.
ما يشتغل في المعاينة قد يختلف عن جهاز زميلك إن اختلفت الإعدادات. اكتب ماذا شغّلت حتى تستطيع إعادة المحاولة.
مثال: صفحة تعرض ناتج جمع رقمين
تريد أن تكتب رقمين وتضغط زرًا فيظهر الناتج. المثال صغير عمدًا حتى تعرف أن البيئة تعمل قبل أي مكتبة.
- حدد الناتج بكلمة: جمع رقمين يظهر تحت الزر. لا تبدأ بإطار عمل لم تجربه.
- ادخل إلى ستاك بلتز من زر الصفحة وتأكد من النطاق. أنشئ مشروعًا جديدًا ولا تفتح قالبًا لا تعرف لغته.
- اكتب المثال وشغّله. إن ظهرت رسالة خطأ فانسخ سطر الخطأ لا كل اللوحة.
- غيّر رقمًا وأعد التشغيل. إن بقي الناتج القديم فحدّث المعاينة قبل أن تتهم الحساب.
- احذف أي سطر لصقتَه من منتدى قبل أن تفهمه. التشغيل بالصدفة لا يُحفظ كحل.
- إن كان المشروع سيبقيه عامًا فلا تضع رمزًا أو رابط قاعدة بيانات داخل الملفات.
بعد نجاح الجمع، أضف سلوكًا واحدًا. القفز إلى تطبيق كامل في الجلسة نفسها يضيع سبب الخطأ.
المتصفح ليس خادم إنتاج
البيئة تصلح للتجربة والتعلم. خدمة يستعملها زبائن تحتاج نشرًا أنت تراقبه، وهذا خارج مثال الجمع.
حدود التشغيل والحفظ تظهر داخل الموقع. لا نكتبها هنا لأنها تتبدل.
أغلق اللسان ثم أعد فتح المشروع وتأكد أن ملف الجمع ما زال كما تركته. الحفظ الذي لم ترَ علامته لا يُعتمد عليه قبل مغادرة الصفحة.
القالب الجاهز ليس فهمًا
فتح قالب ضخم ثم تعديل لونه لا يعني أنك بنيت التطبيق. ابدأ من مثال تقدر أن تشرحه.
لا تشارك رابط المشروع وفيه ملف بيئة منسوخ من عمل سابق.
محرر آخر أو نشر لاحق
- كيف أكتب كود أونلاين
بطاقة ريبلت لبيئة في المتصفح أيضًا. مفيدة إن كان الدرس الذي تتبعه مكتوبًا عليها لا على ستاك بلتز.
- كيف أبرمج تطبيق React أونلاين
بطاقة CodeSandbox حين تكون التجربة واجهة أمامية وتريد رؤية النتيجة بجانب الملفات.
- كيف أنشر موقعي على الإنترنت
بطاقة Vercel لنشر موقع بعد أن استقر المشروع. النشر خطوة لاحقة لا بديل عن تشغيل المثال.
ابنِ المثال كما في تعلم البرمجة بمشروع صفحة واحدة ثم وسّع. القسم: البرمجة. حين لا يفرض الدرس بيئة والقرار تعدد الملفات، انظر اختيار المحرر مع Replit.
ملخص بمساعدة الذكاء الاصطناعي
من إعداد فريق كيف؟ لفهم StackBlitz بسرعة
StackBlitz هي بيئة تطوير سحابية تعمل في المتصفح، تتيح بناء تطبيقات ويب كاملة دون إعداد محلي. مفيدة للمطورين الذين يريدون النمذجة السريعة أو مشاركة الأكواد أو التعلم دون تعقيدات التثبيت.
خطوات سريعة
- افتح موقع StackBlitz.com وانقر على 'New Project'.
- اختر قالب المشروع المناسب (React, Angular, Vue, أو Vanilla).
- انتظر لحظات حتى يتم تحميل البيئة وتثبيت التبعيات تلقائيًا.
- ابدأ بتعديل الملفات في المحرر المدمج، وسترى التغييرات مباشرة في المعاينة.
- استخدم الطرفية المدمجة لتشغيل أوامر npm إضافية.
- احفظ المشروع عبر إنشاء حساب مجاني، ثم انسخ الرابط للمشاركة.
- انشر التطبيق مباشرة باستخدام زر النشر المدمج (اختياري).
متى تستخدمها؟
- عند الحاجة لنموذج أولي سريع لتطبيق React أو Angular أو Vue.
- للمشاركة الفورية لكود تطبيق كامل مع فريق العمل.
- لتعلم أطر العمل الجديدة دون الحاجة لتثبيت بيئة محلية.
- لتجربة مكتبات JavaScript بسرعة قبل دمجها في مشروعك.
نصائح ذهبية
- استخدم اختصار Ctrl+Shift+P لفتح لوحة الأوامر والوصول السريع للإضافات.
- يمكنك استيراد أي مستودع GitHub مباشرة عبر رابط المستودع.
- لتسريع العمل، فعّل وضع 'Offline' لتجنب إعادة تحميل التبعيات في كل مرة.
احذر من
- الخطة المجانية محدودة في وقت الجلسة (قد تنتهي بعد فترة عدم نشاط).
- لا ينصح للمشاريع الإنتاجية الحساسة بسبب قيود الأداء والخصوصية.
- قد لا تعمل بعض الحزم التي تعتمد على مكونات أصلية (native modules) بشكل صحيح.
أُعدّ هذا الملخص بواسطة فريق كيف؟ بمساعدة الذكاء الاصطناعي. يُراجع ويُحدَّث وفق سياسة التحرير. آخر تحديث: 24 أكتوبر 2026. هذه ليست مراجعة بشرية لكل زر في موقع الأداة، والتفاصيل التي تتغير تُراجع على الموقع الرسمي.
أسئلة شائعة عن StackBlitz
StackBlitz توقف في منتصف التحميل. أغيّر المثال؟
انتظر اكتمال فتح المشروع وأعد المحاولة من اتصال ثابت. لا تستبدل المثال قبل أن ترى رسالة خطأ واضحة.
ألصق مفتاح واجهة في ملف على StackBlitz ليعمل المثال فورًا؟
لا. المفتاح لا يوضع في مشروع قد يبقى ظاهرًا. استعمل قيمة تجريبية موثّقة للمكتبة أو أجّل الربط.
القالب في StackBlitz اشتغل. أعتبر نفسي أنهيت التطبيق؟
لا. غيّر نصًا ورقمًا وتأكد أنك تعرف أي ملف فعل ذلك. التشغيل الأول إثبات للبيئة لا لإنجاز المنتج.
هل StackBlitz يحفظ مشروعي إن أغلقت اللسان؟
راجع حالة الحفظ داخل الموقع قبل الإغلاق. لا تفترض أن كل تجربة تبقى بلا حساب أو بلا إجراء ظاهر على الشاشة.
مشابه في البرمجة
عرض الكلكيف أستعد لمقابلة برمجية
حل مشاكل خوارزميات للاستعداد لمقابلات الشركات الكبرى.
كيف أتعلم لغة برمجة جديدة
دروس تفاعلية لتعلم البايثون والجافاسكربت وغيرها بخطوات.
كيف أكتب كود أونلاين
بيئة في المتصفح لملفات وتشغيل ومشاركة، وهذه الصفحة تبيّن متى تختارها ومتى يكفي قلم أو مسار تعلم.
كيف أجرب كود HTML و CSS
ساحة لعب للويب: HTML و CSS و JS مع مشاركة فورية.
أجهزة مرتبطة بالمهمة
أجهزة لمن يكتب الكود على الكمبيوتر. ليست مراجعة، والسعر والمواصفات على أمازون.
شاشة Ultrawide
شاشة عريضة لفتح المحرر والمتصفح معًا أثناء كتابة الكود.
كيبورد ميكانيكي لاسلكي
لوحة مفاتيح إذا كنت تكتب على الكمبيوتر ساعات.
ماك بوك إير M
جهاز محمول لفتح المحرر خارج المكتب. المواصفات الحالية على صفحة المتجر.
قرص SSD خارجي محمول
قرص خارجي لنسخ مشاريع البرمجة احتياطيًا بجانب النسخة على جهازك.
قد نحصل على عمولة عند الشراء عبر روابط أمازون دون أي تكلفة إضافية عليك.