Cara menggunakan contoh coding javascript sederhana

Cara Membuat Form Login Sederhana dengan JavaScript

Cara Membuat Form Login Sederhana dengan JavaScript - Pada postingan kali ini saya akan kembali membahas hal-hal yang berkaitan dengan pemrograman web, yakni membuat sebuah form login pada halaman web.

Pada jejaring sosial seperti facebook, twitter, kaskus dll. Sering kali kita menemukan sebuah form login yang mana biasanya anda di suruh untuk memasukkan username atau email dan kemudian password anda. Hal ini dilakukan bertujuan sebagai keamanan akun anda dari pihak yang bertanggung jawab yang dapat menyalahgunakan akun anda.

Nah, disini akan mencoba membuat form login sederhana dengan menggunakan javascript yang mana terdapat 2 buah inputan yakni username dan password.

Algoritma untuk membuat form login sendiri bisa bilang simple yakni jika username dan password dimasukkan benar maka akan muncul pesan “Selamat anda berhasil login...!!!” dan begitu juga sebaliknya.

Source Code Program

    
        function Login[]{ 
            var user = document.getElementById["username].value;
            var pass = document.getElementById["password].value;

            if [user=="admin" && passw=="123"]{
                alert["Selamat anda berhasil login"];
            }else{
                alert["Username dan password anda salah!"];
            }
        }
    
   

    
        

            

                
Username
                

            
            

                
Password
                

            
            

                

            
        
    

Penjelasan Kode Program

• document.getElemetById["username"].value : digunakan untuk mengambil nilai atau isi dari input dengan id="username"
• document.getElementById["password"].value : digunakan untuk mengambil nilai tau isi dari input dengan id="password"
• if [user=="juned" && pass="123"] : Percabangan dengan menggunakan operator && [artinya kedua kondisi harus terpenuhi yakni user harus bernilai "juned" dan pass harus bernilai "123" maka kondisi akan bernilai TRUE] jika nilai TRUE maka akan ditampilkan pesan Selamat Anda berhasil login.
• else : ketika kondisi bernilai FALSE maka yang akan dijalankan adalah proses yang ada di dalam tag else yakni menampilkan pesan "Username dan password salah!"

Demo Form Login

Untuk melihat demonya secara langsung dapat melalui link yang ada di bawah ini.

Tampilkan Demo

Catatan :

Source code program di atas tidak include dengan kode CSS. Jadi tampilan yang discreenshoot akan berbeda dengan tampilan yang di demo.

Printscreen Output Program

Semoga postingan kali ini bermanfaat, dan jika ada yang ditanyakan mengenai source code diatas, silahkan tinggalkan komentar anda.

Untuk artikel terbaru, silakan baca “Apa itu bahasa pemrograman JavaScript? Developer wajib tahu.”

Tahukah kamu bahwa saat ini ada kelas Belajar Dasar Pemrograman JavaScript yang disusun oleh tim expert Dicoding bersama praktisi industri dan divalidasi oleh tim dari AWS [Amazon Web Services]? AWS menyediakan kelas berbahasa Indonesia di bidang Back-End Developer dan disediakan secara GRATIS melalui program beasiswa Cloud and Back-End Developer Scholarship Program. Beasiswanya untuk umum, tanpa syarat, dan sepenuhnya gratis. Untuk dapat cukup daftar dan isi formulir pendaftaran singkat di aws.dicoding.com. Setelah daftar, pasti dapat!

Biasanya para programmer menggunakan JavaScript untuk memudahkan pekerjaan mereka dan membuat automasi dalam beberapa jenis pemrograman.

💻 Mulai Belajar Pemrograman

Belajar pemrograman di Dicoding Academy dan mulai perjalanan Anda sebagai developer profesional.

Karena itulah, JavaScript begitu penting untuk seorang programmer. Eits, tidak perlu khawatir bagi kamu yang baru memulai atau ingin menjadi programmer JavaScript ya. Kali ini kita akan berkenalan dengan JavaScript, serta fungsi dan contohnya. Simak tuntas sobat!

Apa Itu JavaScript?

Tahukah kamu bahwa JavaScript adalah bahasa pemrograman yang digunakan dalam pengembangan website agar lebih dinamis dan interaktif. Kalau sebelumnya kamu hanya mengenal HTML dan CSS, nah sekarang kamu jadi tahu bahwa JavaScript dapat meningkatkan fungsionalitas pada halaman web. Bahkan dengan JavaScript ini kamu bisa membuat aplikasi, tools, atau bahkan game pada web.

Bicara teknis, JavaScript atau kita singkat menjadi JS merupakan bahasa pemrograman jenis interpreter, sehingga kamu tidak memerlukan compiler untuk menjalankannya. JavaScript memiliki fitur-fitur seperti berorientasi objek, client-side, high-level programming, dan loosely typed.

Sejarah JavaScript

Bagi kamu yang masih awam, mungkin penasaran bagaimana awal mulanya diciptakan bahasa pemrograman ini. 

Pada tahun 1994 JavaScript mulai dikenal, pada saat itu web dan internet sudah mulai berkembang. JavaScript didesain oleh Brendan Eich yang merupakan karyawan Netscape. Transformasi nama JavaScript, dimulai dari Mocha, Mona, LiveScript, hingga akhirnya resmi bernama JavaScript. 

Versi awal bahasa JS hanya dipakai di kalangan Netscape beserta dengan fungsionalitas pun yang masih terbatas. Singkat cerita pada tahun 1996 JavaScript secara resmi dinamakan sebagai ECMAScript. ECMAScript 2 dikembangkan pada tahun 1998 yang dilanjutkan dengan ECMAScript 3 setahun kemudian. ECMAScript terus dikembangkan sampai akhirnya menjadi JavaScript atau JS hingga saat ini. Pada tahun 2016, 92% web diketahui telah menggunakan JavaScript. Itulah mengapa JavaScript atau JS terus berkembang.

Mengapa harus pakai JavaScript?

Sebagai developer zaman now. JavaScript menjadi salah satu bahasa pemrograman yang sangat populer. Mengapa? Di tahun 2016 saja sudah ada sekitar 92% pembuatan web menggunakan JS, apalagi di tahun-tahun sekarang. Tentunya web yang dibuat dengan JS akan lebih dinamis dan interaktif. Banyak perusahaan top global yang sudah mengimplementasikan JS sebagai bahasa pemrograman andalannya. Kita bisa buktikan juga bahwa JS itu populer dan menjadi bahasa yang paling banyak digunakan di Github.

Seperti FB, Linkedin, Trello, Medium, bahkan Google, salah satu bahasa yang digunakan di antaranya adalah JS [JavaScript]. Itulah alasan mengapa para developer berlomba-lomba untuk jadi yang terbaik dalam mempelajari JavaScript.

Fungsi JavaScript

Kamu pasti sudah paham tentunya dengan fungsi JavaScript. Selain membuat web jadi lebih dinamis dan interaktif, JS digunakan juga untuk proses logika data. “Intinya, fungsi JS tidak hanya soal urusan front end, tapi juga sekaligus dipakai untuk urusan back end,” imbuh developer.

Keunggulan JavaScript

Sepertinya kamu sudah mengetahui keunggulan dari JavaScript, tapi saya akan paparkan lebih dalam lagi deh hehe. Inilah beberapa keunggulan JS yang membuat tekadmu kuat untuk mempelajarinya.

1. General Purpose

Saat ini JavaScript tidak hanya digunakan di sisi client [browser] saja lho. Semenjak adanya Node.js JavaScript dapat digunakan di luar dari browser. Dengan begitu kamu bisa mengembangkan back-end [server], console, program desktop, mobile, IoT, game, dan lainnya menggunakan JavaScript.

2. Mudah untuk Dipelajari

Setiap bahasa pemrograman memiliki tingkat kesulitan yang berbeda. Tingkat kesulitan bisa dilihat dari beberapa faktor. Menurut saya sih, syntax atau penulisan jadi salah satu faktor yang paling penting buat dipelajari. JS masih tergolong mudah dipelajari asalkan kamu serius dalam belajar dan selalu berani melakukan improvement atau bermain-main dengan itu. Masih belum percaya JS mudah dipelajari? Baiklah, ini perbandingan JS dengan beberapa bahasa lainnya. Contohnya dalam menampilkan “Hello World!” ya.

Bahasa C++

1

2

3

4

5

6

7

#include

int main[]

{

  std::cout Console. Di dalam console, kita bisa menulis fungsi atau kode-kode javascript dan hasilnya akan langsung ditampilkan.