Menginstal DaisyUI di Laravel

Banyak sekali web developer yang sudah sangat familiar dengan Bootstrap merasa kesal ketika mencoba Tailwindcss karena harus menulis banyak class css pada tag htmlnya. Nah ini disebabkan karena Tailwindcss adalah sebuah framework css yang utility first berbeda dengan Bootstrap yang berbasis komponen.

Kalau kalian ingin pakai Taiilwindcss dengan kelebihan kelebihan yang ditawarkan tapi masih pengen dengan kepraktisan Bootsrap, kalian bisa coba gunakan DaisyUI yang merupakan sebuah plugin untuk Tailwindcss yang menyediakan berbagai macam komponen yang dibangun dengan Tailwindcss.

Dengan DaisyUI kita bisa menggabungkan class yang disediakan oleh Tailwindcss dengan class yang tersedia pada Tailwindcss itu sendiri. Sebagian besar penamaan dari komponen di DaisyUI mirip dengan Boostrap.

Ohya DaisyUI baru saja merilis versi 4, dengan tambahan 2 tema baru, dan meluncurkan toko untuk template template yang dibuat dan kompatibel dengan DaisyUI.

Menginstal DaisyUI

Pertama tentu saja kita harus menginstal DaisyUI terlebih dahulu. Kalau belum punya Tailwindcss, tentu harus instal juga ya. Tapi di sini saya anggap sudah instal Laravel + Breeze, jadi otomatis sudah ada Tailwindcss ya.

npm i daisyui

Setelah DaisyUI terinstal, sekarang kita harus menambahkan sebaris kode ke file tailwind.config.json pada bagian plugins.

plugins: [
  forms,
   require("daisyui")
],

Setelahnya, silakan jalankan perintah dibawah ini.

npm run dev

Sekarang kita sudah bisa menggunakan DaisyUI untuk kebutuhan kita dalam membangun antarmuka halaman web kita.

Untuk saya sendiri DaisyUI ini selalu saya instal untuk mempercepat proses development yang berurusan dengan antarmuka.