Tutorial Kalkulator Umur - Menyiapkan Kebutuhan Pengembangan Web

Berikut adalah kebutuhan bahasa coding , library atau framework yang saya gunakan:

1. Bahasa HTML
2. Bahasa CSS
3. Bahasa JavaScript
4. Minimalist CSS Framework, Pico CSS

Kenapa pakai Pico CSS?

Gambar: Tampilan website Pico CSS

Pico CSS adalah sebuah minimalist CSS framework yang menurut saya sangat sederhana namun tetap leluasa untuk customization, dan sudah mendukung mode gelap-terang (Dark - Light Mode).

Struktur Folder

Struktur folder yang dibutuhkan untuk aplikasi ini tidaklah kompleks, cukup dengan membuat 1 file .html saja dan semua bahasa yang dibutuhkan bisa dimasukkan ke dalam file yang sama. Karena memang aplikasinya sederhana, jadi tidak membutuhkan banyak file.

Projects/
└── kalkulator-umur/
    └── index.html

Contoh struktur folder aplikasi kalkulator umur

Untuk tools yang digunakan hanya 2 saja yaitu:

1. Text editor, saya menggunakan Visual Studio Code
2. Browser, saya menggunakan Google Chrome

Tools yang dibutuhkan tidak terbatas seperti apa yang saya gunakan, semua tools serupa bisa digunakan untuk membuat aplikasi ini.

Aplikasi kalkulator bisa dilihat di sini.