𝗗𝗮𝘆 𝟯𝟮 𝗼𝗳 𝗟𝗲𝗮𝗿𝗻𝗶𝗻𝗴 𝗠𝗘𝗥𝗡 𝗦𝘁𝗮𝗰𝗸

𝗛𝗮𝗿𝗶 𝗸𝗲-𝟯𝟮 𝗕𝗲𝗹𝗮𝗷𝗮𝗿 𝗠𝗘𝗥𝗡 𝗦𝘁𝗮𝗰𝗸

Hari ini saya membuat permainan Ular Tangga.

Proyek ini membutuhkan manipulasi array dan logika yang kompleks. Saya menggunakan HTML5, CSS3, dan Vanilla JavaScript.

Kemarin saya membuat Batu Gunting Kertas. Hari ini saya beralih ke grid 100 sel. Ini membutuhkan pelacakan posisi di seluruh tata letak matematis.

Berikut adalah cara saya membuatnya:

• Saya menggunakan loop untuk membuat grid. Saya tidak melakukan hardcode pada 100 div.
• Saya menggunakan CSS Grid untuk membuat tata letak 10x10.
• Saya menggunakan objek JavaScript untuk mengelola tangga dan ular.

Pemetaan objek tersebut menghubungkan ubin pemicu ke ubin tujuan. Ini menghindari pernyataan if-else yang panjang.

Contoh pemetaan:

• Tangga: 4 ke 14, 9 ke 31, 28 ke 84.
• Ular: 17 ke 7, 54 ke 34, 98 ke 79.

Mengelola transisi spasial pada antarmuka dinamis mengajarkan saya banyak hal tentang state management.

Sumber: https://dev.to/ali_hamza_589ec7b3eb6688d/day-32-of-learning-mern-stack-15o1