Belajar Javascript Untuk Pemula

Javascript adalah bahasa pemrograman tingkat tinggi yang dikembangkan pertama kali oleh Brendan Eich dari Netscape. Penggunaannya familiar dengan browser menggunakan tag <script> dan dijalankan bersamaan dengan HTML (Hypertext Markup Language).

Apa saja yang perlu disiapkan?
1. Komputer / Laptop dengan sistem operasi (Windows, Linux, MacOS, dll)
2. XAMPP Server
3. Browser (Chrome, Mozilla Firefox, Safari)

Mari kita mulai ke tahap selanjutnya. Download XAMPP untuk server menjalankan di local komputer terlebih dahulu.
– Link download klik Disini sesuaikan dengan OS (Operating System / Sistem Operasi yang ada di komputer. Contoh : Windows, MacOS, Linux.

Install XAMPP yang sudah didownload dan diinstall :

XAMPP
XAMPP untuk Windows
XAMPP
XAMPP untuk MacOS

Pada modules Actions tekan tombol Start untuk menjalan servis XAMPP (XAMPP untuk Windows). Pada tab menu Manage Servers tekan tombol Start All untuk menjalankan semua servis XAMPP (XAMPP untuk MacOS).

Pastikan bahwa komputer / laptop anda benar-benar terinstall XAMPP dan servis XAMPP kondisi jalan atau start atau running. Buka browser anda ketikkan url “http://localhost” lalu tekan enter.

http://localhost
Tampilan http://localhost di Windows
http://localhost
Tampilan http://localhost di MacOS

Jika sudah sesuai dengan tampilan di atas maka anda sudah bisa menjalankan Pemrograman Javascript.

Langkah selanjutnya yaitu,
– Buka hasil instalasi XAMPP
– Secara default biasanya berada di drive C:\xampp
– Buka explorer -> pilih drive Local Disk C:\ -> buka folder xampp
– Buka folder htdocs
– Buat folder javascript (klik kanan -> New -> Folder)
– Buka folder yang telah di buat

Folder Javascript
New Folder Javascript

– Buat file index.html(klik kanan -> New -> Text Document)
– Ganti nama dengan index.html

New File
Klik Kanan New File
Javascript
Ganti nama -> index.html

– Buka file index.html yang sudah kita buat
– Ketikkan kode seperti berikut :

<html>
<head>
    <title>Belajar Javascript | BelajarAplikasi.com</title>
</head>
<body>
    <div id="content"></div>
    <script>
        document.getElementById("content").innerHTML = "JAVASCRIPT PERTAMA KU"
    </script>
</body>
</html>

– Simpan hasil ketikkan tersebut.
– Jalankan dengan browser. Maka akan tampil seperti berikut :

localhost
Javascript Pertamaku

Membuat fungsi klik button

– Membuat fungsi klik pada button / tombol, ketika button di klik maka akan muncul sebuah alert atau pemberitahuan.
– Buka kembali file index.html atau buat file baru.
– Ketikkan seperti berikut :

<html>
<head>
    <title>Fungsi Javascript | BelajarAplikasi.com</title>
</head>
<body>
    <h4>Tekan Tombol Tampil</h4>
    <button id="btn_tampil" onclick="klik_button();">Tampil</button>
    <script>
        function klik_button() {
            alert("Belajar Membuat Fungsi OnClick Javascript");
        }
    </script>
</body>
</html>

– Simpan hasil ketikkan tersebut.
– Jalankan dengan browser. Maka akan tampil seperti berikut :

Fungsi OnClick
Fungsi OnClick

Ketika tombol diklik maka seharusnya muncul pemberitahuan seperti gambar.
Sekian dulu dan selamat mencoba.
Happy Coding 🙂

Leave a Reply

Your email address will not be published.