ساحة HTML CSS JS

اكتب الأكواد البرمجية، شغّلها وشاركها - بدون أي إعداد.

معاينةمعاينة تلقائية

وحدة التحكم

ستظهر مخرجات وحدة التحكم هنا.

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>My Playground</title>
        <link rel="stylesheet" href="styles.css" />
    </head>
    <body>
        <h1 id="greeting">Hello, world!</h1>
        <button id="btn">Click me</button>
        <script src="script.js"></script>
    </body>
</html>

ابنِ HTML و CSS و JavaScript مع معاينة مباشرة

ساحة HTML و CSS و JavaScript مجانية اون لاين مع معاينة حقيقية في المتصفح. عدّل ثلاثة ملفات - index.html و styles.css و script.js - ويعيد iframe العرض مع كل تعديل. بدون خادم محلي، بدون إضافة Live Server، وبدون مرحلة build.

المحرر مبنيّ على نفس محرك VS Code، لذا يعمل الإكمال التلقائي لوسوم HTML وخصائص CSS وكود JS. والمعاينة المباشرة تعرض صفحتك داخل iframe معزول في متصفحك. مناسب لرسم صفحة هبوط، أو تجربة CSS grid، أو كتابة سكربتات DOM عادية.

لماذا تفيدك ساحة HTML و CSS و JavaScript هذه

معاينة مباشرة فورية - عدّل HTML أو CSS أو JS ويعيد iframe العرض مع كل تغيير. دون أي خطوة بناء أو إعادة تحميل.
تلوين الصياغة والإكمال التلقائي لـ HTML و CSS و JavaScript. اختصارات بأسلوب Emmet واستجابة فورية، كل ذلك في نفس محرك المحرر المستخدَم في VS Code.
بدون أي تثبيت: لا Node ولا Live Server ولا خادم HTTP محلي. عايِن HTML و CSS و JS من أي متصفح.
معاينة مباشرة للملفات الثلاثة - HTML و CSS و JavaScript تُحرَّر معًا وتعاد معاينتها في iframe مع كل تعديل، بدون مرحلة build.

ما يمكنك بناؤه في ساحة HTML و CSS و JavaScript

صفحة هبوط: HTML منظَّم، CSS حديث (grid وflex وخصائص مخصّصة) ولمسة من JavaScript، كل ذلك يُعاد تحميله مباشرة في iframe المعاينة.
تجارب CSS: تخطيطات grid، محاذاة flex، الرسوم المتحركة، و media queries متجاوبة، مع ردود فعل بصرية فورية عند كل تعديل.
برمجة DOM بـ JavaScript خالص: querySelector ومستمعو الأحداث واستدعاءات fetch وlocalStorage، مع معاينة حية في المتصفح لتغذية راجعة فورية.

الأسئلة الشائعة حول ساحة HTML و CSS و JavaScript

هل ساحة HTML و CSS و JavaScript اون لاين مجانية؟

نعم، استخدام ساحة HTML و CSS و JavaScript مجاني. لا تسجيل، ولا خادم محلي، ولا إضافة Live Server في VS Code - فقط اكتب وشاهد المعاينة.

هل أحتاج إلى خادم محلي أو Live Server في VS Code؟

لا حاجة للتثبيت. لست بحاجة إلى Live Server في VS Code، ولا خادم HTTP محلي، ولا Node. يعرض المتصفح ملفات HTML و CSS و JS مباشرة داخل iframe.

هل تعمل ساحة HTML و CSS و JavaScript على الجوال؟

نعم. تعمل ساحة HTML و CSS و JavaScript على متصفحات الحاسوب والجهاز اللوحي والجوال. يتكيّف المحرر و iframe المعاينة وعلامات تبويب الملفات جميعها مع الشاشات الصغيرة.

هل معاينة HTML و JavaScript هنا آمنة؟

???. ??? ??? HTML ?CSS ?JavaScript ???? iframe ?????? ????? ?? ??????? ?????? ?? ???? Coddy ??????? ??.

كيف أتعلّم HTML و CSS و JavaScript بعد تجربة الساحة؟

عدّل كود HTML و CSS و JS النموذجي، اضغط تشغيل، وشاهد المعاينة تتحدث. وإذا أردت شيئًا أكثر تنظيمًا، فإن دورات HTML و CSS و JavaScript التفاعلية في Coddy تأخذك من المحددات إلى صفحات كاملة.

أدوات مفيدة لـ Web

أدوات مجانية تعمل في المتصفح تتكامل بشكل رائع مع ملعب Web البرمجي - جميعها جزء من Coddy.

عرض جميع أدوات المطورين ورقة Web المرجعية