Membuat Magic Square Generator dengan Javascript
Magic Square atau Kotak Ajaib adalah Kotak persegi umumnya 4 x 4 atau berjumlah 16 sel , setiap sel terdapat angka yang berbeda dari sel yang lain dan penjumlahan angka dari 4 sel secara vertikal, horizontal, diagonal hingga 28 kombinasi lain selalu sama, sehingga dinamai magic square atau kotak ajaib.
Magic Square pernah dipopulerkan pada acara – acara hiburan seperti ajang pencarian bakat, kontes sulap, dan lain-lain. Cara memainkan atau rumusnya telah banyak beredar di internet, sehingga siapapun dapat mencoba nya
Kali ini saya akan membuat aplikasi sederhana berbasis web untuk melakukan generate angka – angka tersebut secara terprogam (Magic Square Generator).
Yang perlu disiapkan adalah:
- Text Editor: Visual Studio Code
- Web Browser: Google Chrome
Langkah – langkahnya:
1. buat folder kosong dimanapun dengan nama magicsquaregen
2. buat file index.html didalam folder magicsquaregen
pada file index.html kita membuat sebuah tabel dengan 4 kolom dan 4 baris, lalu terdapat 1 kotak input angka dan 1 tombol untuk menghitung
3. buat file style.css didalam folder magicsquaregen
pada style.css kita mengatur warna background, letak teks, dan ukuran teks pada sel
4. buat file script.js didalam folder magicsquaregen
pada script.js kita memasukan rumus magic square pada fungsi hitung() untuk memproses inputan angka dari pengguna
5. Buka browser lalu drag file index.html ke browser untuk menampilkan web nya. Tidak memerlukan web server karena html, css, dan javascript berjalan pada sisi client
6. Coba masukan angka antara 15 sampai 99999 pada kotak input lalu klik tombol hitung, maka angka – angka akan muncul pada tabel berwarna merah. Jika dijumlahkan secara horizontal, vertikal, diagonal, maupun kombinasi 4 angka lainnya maka akan memiliki hasil yang sama sesuai dengan angka yang diinputkan
Magic Square Generator dengan javascript berhasil kita buat
