Front End Dev Bagian 3 JavaScript – Mengenal Logic Programming Untuk Membuat Website Dinamis “Front End dan Back End Developer” by Andry Lubis 8 years ago 0 Comments Tutorial ini merupakan lanjutan dari tutorial sebelumnya, yaitu HTML dan CSS. Jika belum mengetahui apa itu HTML dan CSS, kamu bisa mempelajarinya pada tutorial di bawah ini. Full Stack Web Developer Bagian 1 – HTML Full Stack Web Developer Bagian 2 – CSS Saya harap kamu telah mengetahui HTML dan CSS, dan mari kita lanjut belajar. Apa itu JavaScript? JavaScript adalah bahasa pemrograman yang dapat bekerja di lingkungan front-end dan back-end (server). Namun pada tutorial ini, kita akan lebih fokus belajar dalam bidang front end menggunakan JavaScript. JavaScript umumnya digunakan untuk membuat website dan aplikasi yang interaktif dan dinamis, seperti game, live chat, dan media informasi. Cara Penulisan JavaScript Ada 2 cara untuk menulis atau lebih tepatnya menempatkan kode JavaScript. Menempatkan kode JavaScript, di dalam file .html. Menempatkan kode javaScript, di dalam file .js dan memanggilnya di file .html Baiklah untuk tahap dasar, kita akan belajar menampilkan teks menggunakan JavaScript dengan kedua metode penulisan diatas. 1. Menempatkan JavaScript Di Dalam File html Buka teks editor (Sublime Text, VSCode, ataupun teks editor lainya). Kemudian salin kode di bawah ini, lalu simpan dengan nama html-javascript.html, dan lihat hasilnya di browser. 2. Menempatkan JavaScript Di Dalam File .js dan memanggilnya di File html Buka teks editor. Kemudian salin kode di bawah ini, lalu simpan dengan nama teks.js Buka teks editor. Kemudian salin kode di bawah ini, lalu simpan dengan nama teks.html Lihat hasilnya di browser dengan melakukan klik 2 kali pada file teks.html Diatas kita telah belajar menulis kode JavaScript dan mengetahuinya bahwa Javascript bisa ditulis di dalam file html dan diluar file html. Selanjutnya kita akan belajar JavaScript lebih dalam lagi. Silahkan klik tombol Next Step untuk melanjutkan belajar. Di bawah ini kita akan belajar variabel, operator, dan seleksi kondisi. Variable var NamaVariable = "Ini Valuenya"; var AngkaVariable = 100; Contohnya adalah seperti di bawah ini Operator + (tambah) - (kurang) * (kali) / (div atau hasil bagi) % (modulus atau sisa hasil bagi) Contohnya adalah seperti di bawah ini Assignment Operator var nilai = 98; //98 di simpan ke variabel nilai Operator Pembanding var nilai = 98; nilai == 98; // equal operator nilai != 98; // not equal nilai > 98; // greater than nilai < 98; // less than Seleksi Kondisi IF if(true) { // jalankan perintah } Contohnya adalah seperti di bawah ini Seleksi Kondisi IF ELSE if(true) { // jalankan perintah } else { // jalankan perintah } Contohnya adalah seperti di bawah ini Silahkan klik tombol Next Step untuk melanjutkan belajar. Looping atau Iteration Looping atau iteration adalah suatu kondisi yang bertujuan untuk mengulang suatu proses. Di javascript kita dapat melakukan loop dengan menggunakan dua cara, yakni menggunakan for dan while. for(/* inisialiasasi, kondisi, increment ++ / decrement -- */ ) { /* proses */ } while(/* kondisi */) { /* proses */ /* increment ++ / decrement -- */ } Misal ada soal untuk menampilkan heading 1 sampai dengan 6. Pada kasus tersebut bisa saja kita mengetikan dengan html standart untuk menulis script heading 1 sampai dengan 6 secara manual, namun dengan javascript hal tersebut bisa dibuat lebih mudah dan simple tentunya. Berikut adalah scriptnya. Contoh penerapan looping for adalah seperti di bawah ini 2. Contoh penerapan looping untuk while adalah seperti di bawah ini Tutorial ini belum selesai, dan akan segera di update. Nantinya kita akan belajar JavaScript lebih dalam lagi dan membuat suatu project dengan JavaScript 😀 TAGS :Full Stack Web Developer javascript Share This Articles Share this article
ESP32 Modul 3 – Menjelajahi Deep Sleep ESP32 (3/4) by Anton Prafanto 4 months ago 0 ESP32 dapat dibangunkan dari mode tidur dalam dengan menyentuh pin tertentu, memungkinkan interaksi...
ESP32 Modul 3 – Menjelajahi Deep Sleep ESP32 (2/4) by Anton Prafanto 4 months ago 0 ESP32 dapat bangun dari mode tidur dalam pada interval waktu tertentu, memungkinkan proyek...
ESP32 Modul 3 – Menjelajahi Deep Sleep ESP32 (1/4) by Anton Prafanto 4 months ago 0 ESP32 memiliki fitur mode tidur dalam (deep sleep) yang dapat mengurangi konsumsi daya...