Halaman Utama Website date-fns

Beberapa hari lalu saat sedang mengerjakan proyek pengembangan website yang memerlukan pengembangan di bagian tanggal, saya awalnya berusaha apakah bisa saya tangani proyek ini tanpa menggunakan package. Awalnya berjalan lancar tanpa kendala, namun setelah melakukan pengembangan ke tahap yang lebih kompleks, ternyata tidak mungkin saya hanya mengandalkan kelas Date bawaan JavaScript saja.

Di hari itu saya mencoba browsing dan melakukan riset terhadap beberapa utilitas penanggalan di JavaScript. Hal yang paling saya utamakan di sini adalah stabilitas, matang, dan ada fungsi yang saya perlukan. Karena fungsi yang saya perlukan saat itu tidak terlalu kompleks tapi akan sangat kompleks jika dikerjakan secara native dengan kelas Date.

Setelah browsing cukup lama saya mendapat beberapa pilihan yaitu Moment.js, Day.js, dan date-fns. Dan kesimpulan yang saya dapat dari ketiga opsi itu adalah:

• Moment.js: Memiliki fungsi yang banyak namun dukungan terhadap package ini mulai menurun dan catatan pengembangan terakhir saat itu tahun 2020.
• Day.js: ukuran sangat kecil sekitar 2KB namun fitur yang saya butuhkan tidak ada di sana
• date-fns: Ukuran lumayan besar namun fitur yang saya butuhkan ada di sana. Dan catatan pengembangan sering dilakukan.

Maka dari itu, saya di sini merekomendasikan diri untuk menggunakan package date-fns yang ternyata memang sangat membantu mengurangi waktu pengembangan.

Fitur yang saya butuhkan di sini adalah untuk mencari tanggal awal dan akhir dalam satu minggu, serta mendapatkan tanggal awal dan akhir dalam satu bulan.

Untuk mengakali ukuran date-fns yang sangat besar, untungnya saya mengerjakan proyek secara modular sehingga saya bisa menggunakan date-fns hanya pada modul atau fungsi yang diperlukan sehingga ukurannya pun dapat diminimalkan.

Berikut ini fungsi-fungsi yang saya gunakan dalam proyek saat itu:

import { startOfWeek, endOfWeek, startOfMonth, endOfMonth, format} from 'date-fns'

const date = new Date()

// mendapatkan tanggal awal dan akhir di suatu minggu
const startWeekDate = startOfWeek(date)
const endWeekDate = endOfWeek(date)

// mencari tanggal awal dan akhir di suatu bulan
const startOfMonthDate = startOfMonth(date)
const endOfMonthDate = endOfMonth(date)

Lalu, sekarang bagaimana cara memasang package date-fns pada proyeknya? Ada dua pilihan, jika kita melakukan pengembangan menggunakan npm (Node Package Manager) maka cukup dengan mengeksekusi perintah berikut:

npm install date-fns

Jika kita melakukan pengembangan tanpa menggunakan npm, maka cukup menyisipkan package ini secara eksternal seperti ini:

<script src="https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.30.1/date_fns.min.js" integrity="sha512-F+u8eWHrfY8Xw9BLzZ8rG/0wIvs0y+JyRJrXjp3VjtFPylAEEGwKbua5Ip/oiVhaTDaDs4eU2Xtsxjs/9ag2bQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

Untuk lebih detailnya kita bisa melihat dokumentasi cara penggunaan package date-fns ini.

Cukup sekian catatan kali ini semoga bisa membantu memecahkan masalah yang sedang dihadapi. Terutama bagi saya pribadi ini akan sangat membantu bagi saya di masa yang akan datang, karena manusia pasti terkena penyakit lupa, maka tidak ada salahnya jika membuat catatan pribadi seperti ini 😊.

Selebihnya mohon maaf apabila ada salah kata. Terima kasih.