Bootstrap 6 alfa: Tailwind usulü sınıflar, yerleşik HTML öğeleri ve ajanlar için beceriler

Uzun bir sessizlikten sonra

Bootstrap, 2011’den beri en çok kullanılan CSS kütüphanelerinden biri. Hazır bileşenleri (buton, menü, pencere) ve ızgara sistemiyle, tasarımcısı olmayan projelerin kurtarıcısıydı. Son yıllarda sahneyi Tailwind CSS aldı. npm’in kendi sayaçlarına göre 4–10 Ekim haftasında tailwindcss paketi yaklaşık 136 milyon kez indirildi, bootstrap ise 6 milyona yakın.

Bootstrap’in yaratıcılarından Mark Otto, 8 Ekim’de Bootstrap 6’nın ilk alfasını duyurdu. Yazının başlığındaki ton da şaka yollu: “Yeni Bootstrap mı? 2015’te miyiz?”

Tailwind’den alınan sözdizimi

En göze çarpan değişiklik duyarlı sınıflarda. Bootstrap 5’te ekran boyutu sınıf isminin ortasına sıkışıyordu. Şimdi başa geliyor:

• .d-md-none → .md:d-none
• .col-lg-6 → .lg:col-6
• .opacity-50-hover → .hover:opacity-50

Otto bunun Tailwind’in yönteminin doğrudan kopyası olduğunu kendisi yazıyor ve daha iyi olduğunu ekliyor. Mantığı basit: “Orta boy ekranda ve üstünde” anlamındaki md: ön eki hep aynı yerde duruyor. Sınıfı okurken önce ne zaman, sonra ne olacağını görüyorsun. Fare üstüne gelme (hover:) gibi durumlar da aynı kalıbı kullanıyor.

Tarayıcının kendi öğeleri

Bootstrap 6, eskiden JavaScript ile taklit edilen şeyleri tarayıcıya bırakıyor:

• Modal yerine Dialog. Açılır pencereler artık HTML’in yerleşik <dialog> öğesiyle çalışıyor.
• Akordeon JavaScript’siz. <details> ve <summary> öğeleriyle açılıp kapanıyor, animasyonu da sadece CSS.
• Dropdown artık Menu, offcanvas artık drawer. Sınıf ve olay isimleri değişti.
• Renkler tek kalıpta. .btn-primary gibi bileşene özel renk sınıfları gitti. Yerine .btn-solid theme-primary gibi, her bileşende aynı çalışan .theme-* sınıfları geldi.

Bunun bedeli tarayıcı desteği. Bootstrap 6 Chrome ve Edge 130, Firefox 132, Safari 18 istiyor. Bootstrap 5 Safari 12’ye kadar iniyordu.

JavaScript tarafı

jQuery desteği tamamen kaldırıldı. Eklentiler sadece ES modülü olarak geliyor, yani <script> etiketine type="module" eklemen gerekiyor. window.bootstrap diye global bir nesne de artık yok. Kaynak kod TypeScript’e geçti ve tip tanımları paketle birlikte geliyor.

Ajanlar için belgeler

Bu sürümün en “2026” tarafı burası. Bootstrap artık iki metin dosyası yayımlıyor: Bütün belge sayfalarının listesi olan llms.txt ve bütün belgelerin tek dosyada birleştiği, yaklaşık 1,3 MB’lık llms-full.txt. Bu biçimi Tailwind’in llms.txt tartışmasında konuşmuştuk.

Depoda bir de skills/ klasörü var. İçinde kod ajanları için 11 beceri dosyası duruyor: v5’ten ve v4’ten v6’ya geçiş, Vite, Webpack ve Parcel ile kurulum, bileşen yazma gibi. Yani projeni taşırken ajanına “şu dosyayı oku ve uygula” diyebiliyorsun. Bilgiyi doğrudan bakımcılar yazdığı için, ajanın eski Bootstrap 5 alışkanlıklarıyla kod üretme ihtimali azalıyor.

Şimdi geçmeli misin?

Hayır, en azından henüz değil. Bu bir alfa ve beta öncesinde daha çok şey değişebilir. Bootstrap 5 destekleniyor ve 5.4.0 sürümü de yolda. Ama bir Bootstrap projesi yönetiyorsan, geçiş rehberine şimdiden göz atmak ne kadar iş çıkacağını görmeni sağlar.

Düşün

• Bir kütüphanenin rakibinden bir fikri açıkça alması sence zayıflık mı, olgunluk mu?
• Kullandığın kütüphanelerin belgeleri ajanın için de yazılmış olsaydı, kod yazma şeklin değişir miydi?

Kendi cümlelerimizle yazılmış bir özettir, çeviri değildir. Tüm kaynaklar yukarıda.