Tailwind'i ilk gördüğünüzde HTML'in içi sınıf çöplüğüne dönmüş gibi geliyor. Haklısınız, ilk bakışta öyle. Ama bir hafta kullandıktan sonra normal CSS dosyasına dönmek istemiyorsunuz. İşte sebebi.
Prototip hızı
Butonun rengini değiştirmek için CSS dosyasını açıp sınıf aramıyorsunuz. HTML'de bg-blue-600 yazıyorsunuz, bitti. Tasarım kararı verme hızınız artıyor çünkü denemesi ucuz. Beğenmediniz, sınıfı siliyorsunuz.
Responsive tarafı dertsiz
md:, lg: önekleriyle mobil ve masaüstü aynı satırda yazılıyor. Ayrı media query bloğu açıp hangi sınıfın nerede ezildiğini takip etmek zorunda kalmıyorsunuz.
Küçük dosya, hızlı site
Tailwind üretimde kullanmadığınız sınıfları temizliyor. Sonuç: birkaç KB'lık CSS dosyası. Elle yazılmış binlerce satırlık stil dosyasıyla aynı işi daha hafif yapıyor.
Hepsinden önemlisi: tutarlılık
Projede iki kişi çalışınca biri 12px, biri 14px boşluk veriyor, renkler birbirini tutmuyor. Tailwind'in ölçeği bunu engelliyor. Herkes aynı spacing, aynı renk paletinden seçiyor. Tasarım kendi kendine tutarlı kalıyor.
Ben projelerimde Figma'da tasarlayıp Tailwind ile birebir koda döküyorum. Tasarımcıyla yazılımcı aynı dili konuşunca revizyon turları kısalıyor.
Eleştirisi de var tabii: uzun sınıf listeleri okunabilirliği düşürebiliyor. Tekrar eden yapılar için @apply ya da bileşen çıkarmak gerekiyor. Ama artısı eksisinden ağır basıyor, o yüzden kullanıyorum.
