Assalamualaikum teman-teman kali ini kita akan membahas mengenai lingkungan pengembangan untuk javascript, lingkungan pengembangan atau Development Environtmen adalah sebuah sistem atau tools dimana nantinya kita akan menuliskan program kita.

Biasa bahasa-bahasa pemrograman lain seperti Java C atau Python itu ada yang harus kita install dan konfigurasi terlebih dahulu seperti misalnya kita harus install dulu compilers virtual machine atau program-program pendukung lainnya.

Kita tidak perlu melakukan itu semua, karena pada umumnya kalian sudah punya lingkungan pengembangan javascriptnya, kalian pasti sudah punya web browser di komputer atau laptop kalian.

Find the Best Web Browser for Your Devices: A Review of Chrome, Safari and Edge, image : wjs.com

Jadi tiap-tiap web browser itu sudah ada interpreter javascript di dalamnya, kalian boleh pakai web browser apapun untuk mengikuti seri ini namun yang akan saya gunakan di sini nantinya adalah Google Chrome.

Ada 2 cara agar kita dapat berinteraksi dengan interpreter javascript yang ada di browser kita, yang pertama adalah dengan menggunakan konsol yang ada di developer tools dari tiap-tiap Browser.

1. Console

Gimana cara mengakses file pada Google Chrome?

Tapi kita harus punya dulu sebuah halaman web agar kita bisa mengakses konsolnya, kita coba buat sebuah halaman HTML, jadi ini contohnya.

Kita bisa lihat di browser dan hasilnya sepeti ini.

sekarang kita akan akses kontrol kita di Google Chrome dengan cara Klik Kanan halaman web nya kita pilih inspect nanti dia akan memunculkan Menu seperti ini.

elements pada chrome

Nah kalau misalkan kalian mau lihat isi HTML dari sebuah web

kalian bisa tap element, kalau mau lihat console klik sebelahnya, nanti akan muncul console javascript, konsol ini penting banget untuk kalian kenali.

console pada chrome

Yang pertama perintah javascript atau syntax javascript langsung di konsol ini, contohnya tulis aja script sederhana

alert('Belajar di KuyCODING,com');

Ini merupakan 1 baris perintah sederhana dari javascript kalian tinggal pencet enter, nanti ada popup kecil seperti ini

popup dari javascript

Yang kedua, juga bisa menggunakan kontrol ini untuk mengetahui kalau misalkan ada error atau kesalahan pada program javascript kalian.

Nanti console ini akan memberi tahu errornya apa terjadi di file mana dan dibaris berapa.

Yang ketiga, kalian bisa gunakan console untuk melakukan debug pada program kalian, nanti kita sering banget gunakan sebuah fungsi yang namanya Console.log(), yang kalian tulis pada javascriptnya untuk memunculkan sesuatu di dalam consolenya.

2. HTML

Bagaimana kita bisa berinteraksi dengan javascript adalah dengan menuliskan script javascript itu sendiri di halaman html.

Cara menuliskan ada dua cara, kita bisa simpan di dalam html nya atau kita bisa membuat file javascript terpisah, misalkan

Untuk menuliskan javascript itu kita bisa membuat di dalam html, kita taruh scriptnya di dalam body jadi diantara <body> … </body> bisa di lihat gambar diatas ya.

Kita juga bisa memisahkan HTML dengan Javascript, dalam artian HTML dan javascript tidak dalam satu file, caranya begini :
1. Buat file dengan nama lat.js dalam satu folder.
2. Tuliskan <script src=”lat.js”></script> pada file html
3. Edit file lat.js atau tambahkan baris kode ini alert(‘Belajar di KuyCODING’);

Bisa lihat gambar dibawah ini untuk lebih jelasnya.

html dengan javascript terpisah
javascript terpisah dengan html

Hasilnya akan sama, kita sudah berhasil berinteraksi dengan file javascript yang terpisah.

Jadi itu adalah dua hal yang bisa kita lakukan untuk berinteraksi dengan javascript, yang pertama adalah dengan menggunakan console yang kedua adalah dengan menuliskan scriptnya nya di halaman web kita.

Sekian dulu untuk sesi ini, kita akan lanjutkan belajar javascriptnya .di sesi selanjutnya.
Selamat belajar & jangan lupa bahagia!

LEAVE A REPLY

Please enter your comment!
Please enter your name here