Proyek Web: Merakit Jam Digital Real-Time yang Cantik
Halo Sobat Jurnal Coding! Waktunya kita menyegarkan pikiran dari teori-teori berat dan mulai membangun proyek visual yang sangat keren.
Pernahkah kamu menyadari bahwa hampir semua perangkat digital di sekitarmu selalu menampilkan jam? Waktu adalah elemen yang sangat krusial. Bagaimana jika hari ini kita memprogram jam digital kita sendiri? Kita akan membuatnya dengan gaya Glassmorphism yang tembus pandang dan mewah.
### Membaca Waktu dengan JavaScript
Komputer memiliki mesin waktu di dalam sistemnya. Kita bisa meminta JavaScript untuk melihat jam tersebut menggunakan objek khusus bernama Date.
Bayangkan perintah Date ini seperti tindakan manusia melirik jam tangan. Saat kode dijalankan, komputer langsung mencatat waktu pada milidetik tersebut. Namun, kita hanya butuh satuan jam, menit, dan detik. Kita bisa mengekstraknya menggunakan fungsi:
1. getHours() untuk mengambil Jam.
2. getMinutes() untuk mengambil Menit.
3. getSeconds() untuk mengambil Detik.
### Asisten yang Tak Pernah Lelah
Jika kode tadi hanya dipanggil sekali, waktunya akan diam seperti foto dan tidak berdetak. Agar jam tersebut terus diperbarui setiap detiknya ke layar, kita membutuhkan asisten gaib yang rajin mengecek waktu berulang-ulang tanpa henti. Asisten ajaib ini bernama setInterval.
### Mari Menulis Kodenya!
Salin mahakarya kode di bawah ini ke dalam file kamu, lalu buka di peramban browser:
Proyek jam ini bisa kamu pamerkan di halaman portofolio kamu. Jika kamu sudah paham cara kerja perulangan waktu ini, mari kita melangkah ke tingkat selanjutnya dengan membuat mesin pengukur waktu yang bisa kita atur sendiri (Stopwatch) di proyek berikutnya!
Pernahkah kamu menyadari bahwa hampir semua perangkat digital di sekitarmu selalu menampilkan jam? Waktu adalah elemen yang sangat krusial. Bagaimana jika hari ini kita memprogram jam digital kita sendiri? Kita akan membuatnya dengan gaya Glassmorphism yang tembus pandang dan mewah.
### Membaca Waktu dengan JavaScript
Komputer memiliki mesin waktu di dalam sistemnya. Kita bisa meminta JavaScript untuk melihat jam tersebut menggunakan objek khusus bernama Date.
Bayangkan perintah Date ini seperti tindakan manusia melirik jam tangan. Saat kode dijalankan, komputer langsung mencatat waktu pada milidetik tersebut. Namun, kita hanya butuh satuan jam, menit, dan detik. Kita bisa mengekstraknya menggunakan fungsi:
1. getHours() untuk mengambil Jam.
2. getMinutes() untuk mengambil Menit.
3. getSeconds() untuk mengambil Detik.
### Asisten yang Tak Pernah Lelah
Jika kode tadi hanya dipanggil sekali, waktunya akan diam seperti foto dan tidak berdetak. Agar jam tersebut terus diperbarui setiap detiknya ke layar, kita membutuhkan asisten gaib yang rajin mengecek waktu berulang-ulang tanpa henti. Asisten ajaib ini bernama setInterval.
### Mari Menulis Kodenya!
Salin mahakarya kode di bawah ini ke dalam file kamu, lalu buka di peramban browser:
00:00:00
Proyek jam ini bisa kamu pamerkan di halaman portofolio kamu. Jika kamu sudah paham cara kerja perulangan waktu ini, mari kita melangkah ke tingkat selanjutnya dengan membuat mesin pengukur waktu yang bisa kita atur sendiri (Stopwatch) di proyek berikutnya!