تجربة كود HTML أونلاين

اكتب أو الصق كود HTML وCSS وJavaScript وشغّله أثناء الكتابة. شاهد الصفحة، وما تسجّله، وأخطاءها، على الهاتف أو الجهاز اللوحي أو الكمبيوتر.

يظهر هنا ما تسجّله الصفحة بـ console.log، وتظهر أخطاؤها أيضًا.

لا يُرسل شيء حتى تنشئ الرابط. بعدها يستطيع أي شخص معه الرابط فتح الصفحة دون حساب.

جرّب HTML وCSS وJavaScript في متصفحك

يعمل الكود أثناء الكتابة: HTML، وCSS في وسم <style>، وJavaScript في وسم <script>، كما في أي موقع، مع المكتبات التي تجلبها الصفحة من شبكات CDN العامة المعروفة. ويعمل داخل إطار معزول على عنوان آخر، فلا يستطيع قراءة solta.now ولا ملفات تعريف الارتباط ولا حساباتك.

لا يُرسل شيء أثناء التجربة. ويبقى الكود محفوظًا في هذا المتصفح إلى أن تضغط امسح، فتجد الصفحة التي كنت تجرّبها هنا غدًا.

ما الذي تتحقق منه قبل أن ترسل صفحة

  • تُقرأ جيدًا على الهاتف. اختر الهاتف: أغلب الروابط المرسلة في المحادثات تُفتح على هاتف. ابحث عن نص يخرج عن الشاشة، وعن أزرار أصغر من أن تُضغط.
  • وحدة التحكم هادئة. يظهر فيها كل خطأ مع سطره. اضغط السطر، فيُفتح الكود عنده.
  • كل الصور والملفات تُحمَّل. تذكر وحدة التحكم اسم أي ملف لم تستطع الصفحة تحميله. وإن كان بجانب الصفحة على جهازك، فافتح المجلد كله.
  • كل زر يفعل ما يقوله. اضغط كل زر، واكتب في كل حقل.
  • تُطبع جيدًا، إن كان أحد سيطبعها. يعرض احفظ كملف PDF الصفحة كما تطبعها الطابعة.

جرّب صفحة كتبها Claude أو ChatGPT

انسخ الصفحة التي كتبها لك الذكاء الاصطناعي واضغط الصق. وإن لم يعمل شيء، تذكر وحدة التحكم الخطأ والسطر: أخبر بهما الذكاء الاصطناعي، والصق ما يرسله لك. والصفحة التي تبدأ بأسطر import هي مكوّن React، يجب أن يُبنى ليصبح صفحة قبل أن يستطيع أي متصفح عرضه: لماذا يُفتح Artifact بلغة React فارغًا. الصقه في المربع على الصفحة الرئيسية، فيبنيه Solta عندما ينشره.

عندما تعمل الصفحة، ينشرها أنشئ رابطًا تحت الصفحة على عنوانها الخاص، وتُفتح دون حساب. ولتفتح ملف HTML أرسله إليك أحدهم بدلًا من كتابة واحد، استخدم عارض HTML، الذي يبدأ بالصفحة لا بالكود.

أسئلة

هل هذا HTML compiler؟

ليس تمامًا: HTML لا يُترجَم مسبقًا. المتصفح يقرؤه ويشغّل سكربتاته، وهذه الصفحة تفعل الشيء نفسه أثناء الكتابة. إنها ما يسميه الناس HTML compiler أو HTML runner: يعمل الكود، وترى النتيجة.

هل تتحقق من صحة كود HTML؟

لا. تشغّل صفحتك كما يشغّلها المتصفح، وتعرض «وحدة التحكم» كل خطأ تقع فيه سكربتاتها مع سطره. وللتحقق من الوسوم نفسها وفق معيار HTML، استخدم مدقّق الوسوم من W3C.

هل يمكنني تجربة JavaScript؟

نعم. تعمل السكربتات كما تعمل على أي موقع. وما تسجّله بـ console.log، وكل خطأ، يظهر في «وحدة التحكم» تحت الصفحة، مع سطر الكود الذي جاء منه.

هل يُحفظ الكود؟

يبقى محفوظًا في هذا المتصفح، فتجده هنا حين تعود، إلى أن تضغط «امسح». ولا يُرسل شيء إلى Solta حتى تضغط «أنشئ رابطًا».

هل يمكنني تجربة صفحة ملفات أنماطها وصورها منفصلة عنها؟

نعم. «افتح مجلدًا»، أو افتح ملف zip من المجلد بـ «افتح ملفًا»، فتعمل الصفحة مع ملفات أنماطها وسكربتاتها وصورها. ويمكنك تغيير أي ملف منها هنا.

هل يمكنني التجربة على الهاتف؟

نعم. على الهاتف، يتناوب «الكود» و«الصفحة» على الشاشة. وعلى الكمبيوتر، يعرض «الهاتف» الصفحة بعرض 390 بكسلًا، وهو عرض الهاتف تقريبًا.

كيف أُري أحدهم ما جرّبته؟

ينشر «أنشئ رابطًا» الصفحة على عنوانها الخاص، وتُفتح دون حساب. والموقع المنشور دون حساب يبقى 24 ساعة. لتحتفظ به، سجّل الدخول من البطاقة التي تعرض عنوانه.

انشر مباشرة من محادثة الذكاء الاصطناعي

اربط Solta بـ Claude أو ChatGPT واطلب ذلك: يُنشر الموقع برابط، دون نسخ أي كود.