tailwind CSS v4.0: Modern Web Geliştirmenin Kusursuz Oyun Değiştiricisi [Çeviri Yazı]

• v4.0'ın en önemli özelliği performans iyileştirmeleri: tam derlemeler en fazla 5 kat, artımlı derlemeler ise 100 kattan fazla hızlandı
• CSS öncelikli yapılandırma ile paradigmanın değişimi: tailwind.config.js yerine yapılandırma artık doğrudan CSS içinde yapılıyor
• @layer kullanarak stil önceliğini kontrol etme
• @property kuralıyla özel özellikler tanımlanabiliyor
• Color-Mix() fonksiyonuyla CSS değişkenleri ve currentColor dahil tüm renk değerlerinin saydamlığı ayarlanabiliyor
• margin-left ve margin-right yerine margin-inline gibi mantıksal özellikler ile tek seferde işlem yapılabildiğinden RTL desteği çok daha basit hale geliyor
• Kurulum süreci sadeleştirildi: npm i tailwindcss @tailwindcss/postcss export default { plugins: ["@tailwindcss/postcss"],}; @import "tailwindcss"; yeterli
• Otomatik içerik algılama: artık .gitignore ile görsel/video gibi ikili dosyalar otomatik olarak yok sayılıyor ve ilgili dosyalar otomatik taranıyor. İstisnalar için @source desteği var
• Öncelikli olarak Vite Plugin desteği
• Dinamik utility üretimi sayesinde mevcut yapılandırmada olmayan değerler de doğrudan kullanılabiliyor
• Gelişmiş renk sistemi: varsayılan renk paletinin tamamı RGB'den OKLCH'ye yükseltildi
• Container Queries framework'e yerleşik olarak geldi
• 3D Transforms desteği ve geliştirilmiş gradient'ler eklendi
• Yeni Variants ve Utilities dahil edildi: not-*, starting, inert, nth-*, descendant variant'ları ile field-sizing, color-scheme, inset-shadow-* utility'leri
• Beklenenden daha kolay geçiş: değişikliklerin çoğu otomatik olarak yükseltilebiliyor
• tailwind'in çizdiği büyük resim: basit bir framework güncellemesinin ötesinde, CSS'in geleceğine yönelik cesur bir hamle
• Yükseltmek şart mı?: yeni projelerde v4.0 tercih edilmeli. Mevcut projeler ise modern tarayıcıları hedefliyorsa kolayca yükseltilebilir
• Sonuç: tailwind CSS v4.0 sadece bir evrim değil, bir devrim

[labeldock]

Tailwind’i uygulayıp 1 yıl kullandıktan sonra vardığım sonuç:
Bir sonraki projede kullanır mıyım? EVET
Web geliştirmenin oyun değiştiricisi mi? HAYIR

“Oyun değiştirici” ifadesi bana abartılı geldiği için yorum yazmak istedim.
Bunun gelecekte yönelmemiz gereken ilerici bir stil olduğunu kesin bir dille söylemek zor gibi görünüyor.

Tailwind; şablon kopyala-yapıştır, yapay zeka ile kolay üretim ve basit stil ayarlarında avantaj sağlıyor, ancak

kolay okunabilen etiketlerde bile karmaşıklığa yol açıyor ve tasarımcının hazırladığı tasarımı ince ayrıntılarıyla birebir uygulamak da zor. CSS değişkenleri doğru tanımlanırsa, zorluk seviyesi açısından inline style’dan çok da farklı olmayacağını düşünüyorum.

[bluekai17]

Lütfen rn desteği..

[iolothebard]

Çok uzağa gitme… Her şeyi yutabilir…

[ng0301]

Önce 3.x kullanırım, sonra gerçekten ana akım olursa muhtemelen geçiş yaparım.

[savvykang]

https://tailwindcss.com/docs/upgrade-guide

• shadow-sm -> shadow-xs
• shadow -> shadow-sm

Bir sonraki sürümde bu kez hangi uyumluluğu bozacaklarını tahmin etmek zor görünüyor

[cocofather]

Sürekli.akıyo.ortaya.çıkan.web.teknolojileri.
Zaten.var.olan.teknolojiler.de.yeterli.
Sadece.C.assembly.HTML.JavaScript.olsun.yeter.hepsi.mümkün.

[bokjjang]

Hâlâ Excel function kullanmayanlardan mısınız?
Hesap makinesiyle de hepsi yapılabilir.

Peki ama neden boşluk bırakmak yerine nokta kullanıyorsunuz?

[mse9000]

Bu, insan "boomer konuşma tarzı"nın bir parçası. Sanırım yaşlıların boşluk bırakmak yerine sık sık nokta yazmasını parodileştiriyor..

[codemasterkimc]

Sayın Kim. Size cüret edip bir tavsiyede bulunmak istiyorum. Başka bir şey değil, excel functionları çok fazla kullanmayın.. Bir kolaylık varsa, risk de artar. Öküz kesmek için ona uygun bir bıçak vardır; tavuk keserken de öyle bir bıçak gerekir mi? Basit olan doğru cevap olabilir.

[swooooooo]

Hahahahahahaha, çok komik.

[illiil1lii]

Mevcut projeler, hizmet en yeni tarayıcıları hedefliyorsa kolayca yükseltilebilir

😅

[ahwjdekf]

Basitleştirme ve yükseltme diyorlar ama sonuçta yine yeni bir şey öğren diyorlar. Olay bu.