Setup TailwindCSS di dalam project Angular

Kali ini saya akan membagikan tutorial cara mudah setup Tailwindcss di dalam project Angular.

Pertama pastikan kalian sudah memiliki project Angular atau bisa klik link Tutorial Setup Angular kemudian masuk ke dalam project angular lalu buka terminal dan masukan perintah

ng add @ngneat/tailwind

lalu enter

ketik "Y" lalu enter

lalu klik enter atau "N"

kemudian pilih "class" dan enter untuk enable Dark Mode pada TailwindCSS

kemudian pilih "form" dan "typography" untuk enable plugin form dan typography dengan menekan "space" pada keyboard lalu tekan Enter dan tunggu sampai proses instalasi selesai

kemudian jalankan perintah

ng serve

buka browser dan masukan URL http://localhost:4200

lalu coba edit file "app.component.html" dan tambahkan class TaildwindCSS

<button
     class="py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-red-800">Button TailwindCSS</button>

Tailwindcss berhasil di tambahkan, dan kalian bisa edit file "tailwind.config.js" yang otomatis tergenerate pada saat pertama instalasi TailwindCSS di atas.