Playground JavaScript – Jalankan JS, HTML, CSS
Tulis dan jalankan JavaScript, HTML, dan CSS dalam iframe sandbox dengan panel output konsol langsung dan pratinjau. Akses jaringan diblokir oleh meta tag CSP secara default; Anda dapat mengaktifkannya dengan peringatan yang terlihat. Gunakan mode auto-run untuk menjalankan kode saat Anda bekerja, atau Stop/Reset untuk membuat ulang iframe dan menghentikan loop tak terbatas. Contoh starter membantu Anda memulai.
Playground JavaScript adalah ruang kerja pengodean berbasis browser untuk menulis dan menjalankan JavaScript, HTML, dan CSS. Editor memiliki tab JS, HTML, dan CSS terpisah, dengan panel pratinjau dan panel output konsol langsung sehingga Anda dapat memeriksa halaman dan output-nya bersama-sama. Gunakan untuk bereksperimen dengan cuplikan pendek atau mencoba kode tanpa memasang lingkungan pengembangan lokal.
Kode berjalan di dalam iframe sandbox yang dikonfigurasi dengan allow-scripts dan tanpa allow-same-origin. Meta tag CSP memblokir akses jaringan secara default; Anda dapat mengaktifkannya, dan antarmuka menampilkan peringatan yang terlihat. Mode auto-run menjalankan kode saat Anda bekerja. Jika skrip macet dalam loop tak terbatas, Stop/Reset menghancurkan dan membuat ulang iframe. Contoh starter juga disertakan.
JavaScript, HTML, dan CSS memiliki peran berbeda dalam halaman web: HTML menyusun konten, CSS mengontrol tampilannya, dan JavaScript menambahkan perilaku. Menyimpannya dalam tab terpisah memudahkan pengujian cara bagian-bagian ini bekerja sama, meninjau perubahan dalam pratinjau, dan memeriksa output di konsol.
Playground JavaScript berjalan sepenuhnya di browser Anda. Input Anda diproses di perangkat Anda dan tidak diunggah, disimpan, atau dikirim ke server. Alat ini berfungsi offline setelah halaman dimuat, dan gratis untuk digunakan. Developer dan insinyur DevOps dapat menggunakannya untuk mengeksplorasi kode, memeriksa perilaku halaman, atau mengerjakan tugas pemrograman cepat dari mesin yang berbeda.
Langkah 1: Buka tab JS, HTML, dan CSS lalu masukkan kode yang ingin Anda coba. Gunakan tab yang relevan untuk setiap bagian halaman Anda.
Langkah 2: Pilih apakah akan menggunakan mode auto-run. Ketika diaktifkan, kode Anda berjalan otomatis saat Anda bekerja.
Langkah 3: Ingat perlindungan jaringan default: meta tag CSP memblokir akses jaringan. Anda dapat mengaktifkan akses jaringan, dan playground menampilkan peringatan yang terlihat.
Langkah 4: Jalankan kode Anda dan periksa pratinjau serta panel output konsol langsung untuk melihat hasilnya.
Langkah 5: Jika kode macet dalam loop tak terbatas, gunakan Stop/Reset untuk menghancurkan dan membuat ulang iframe sandbox.
Kasus penggunaan: Mencoba cuplikan JavaScript tanpa memasang lingkungan pengembangan lokal. Playground menjalankan kode Anda di browser dan menampilkan output konsol langsung.
Kasus penggunaan: Memeriksa cara kerja HTML, CSS, dan JavaScript bersama-sama dengan mengeditnya di tab terpisah dan meninjau pratinjau.
Kasus penggunaan: Menyelidiki perilaku kode dengan panel output konsol langsung di samping pratinjau halaman.
Kasus penggunaan: Memulihkan dari loop tak terbatas dengan menggunakan Stop/Reset untuk menghancurkan dan membuat ulang iframe.
Kasus penggunaan: Mengerjakan tugas pemrograman dari mesin tempat Anda tidak memiliki pengaturan lokal yang tersedia.
Kasus penggunaan: Menghindari pengiriman kode atau data internal ke layanan pihak ketiga: playground memproses input di browser Anda.
Kasus penggunaan: Menjelajahi contoh starter ketika Anda menginginkan titik awal untuk bereksperimen dengan JavaScript, HTML, atau CSS.