Css Ruby on Rails Haml

Haml’de `Dinamik Sınıf Değeri` Nasıl Ayarlanır

Ruby on Rails projelerinizde ERB’den Haml’a geçiş yapıyorsanız, HTML yapınız içinde dinamik değerleri temsil etmeniz gereken bir durumda olabilirsiniz. Özellikle, yaygın bir senaryo, bir öğenin durumuna dayalı olarak bir CSS sınıfını dinamik olarak ayarlama durumudur. Bu blog yazısı, bunu Haml’de nasıl başaracağınıza dair bir rehber sunacaktır.

Problem

ERB şablonunuzda şöyle bir kod satırı olabilir:

<span class="<%= item.dashboardstatus.cssclass %>"><%= item.dashboardstatus.status %></span>

Bu kod, mevcut atanmış durumun CSS sınıfını bir <span> öğesine etkili bir şekilde ilişkilendirir. Bu kodu Haml’a dönüştürmeye çalıştığınızda, ilk başta biraz kafa karıştırıcı görünebilir. Dinamik davranışın sağlam kalmasını sağlarken, Haml’ın temiz sözdizimini kullanmak istersiniz.

Haml’deki Çözüm

Haml, daha az kod yazarak görünümleri basitleştirir ve okunabilirliği artırır. Yukarıdaki satırı Haml’a dönüştürmek için aşağıdaki yaklaşımı izleyebilirsiniz:

%span{:class => item.dashboardstatus.cssclass}= item.dashboardstatus.status

Haml Kodunu Parçalara Ayırma

Bu Haml kod bölümü üzerinden nasıl işlediğini anlamak için inceleyelim:

%span: Bu kısım, bir <span> HTML öğesi oluşturmak istediğinizi gösterir.
{:class => item.dashboardstatus.cssclass}: İşte burada sihir gerçekleşiyor! Bu sözdizimi, <span>nın class özniteliğini bir Ruby hash’i kullanarak ayarlar. Anahtar :class, bir CSS sınıfı ayarladığımızı belirtirken, değer item.dashboardstatus.cssclass‘dan dinamik olarak alınmaktadır.
= item.dashboardstatus.status: Eşittir işareti (=), ardından gelen şeyin <span>nın içeriği olarak eklenmesini sağladığını gösterir; bu durumda içerik item.dashboardstatus.status değeridir.

Neden Haml Kullanmalısınız?

Haml kullanmanın geliştirme iş akışınızı iyileştirebilecek birkaç nedeni vardır:

Daha Temiz Sözdizimi: Haml, iç içe geçmeyi belirtmek için girintiyi kullanır, bu da geleneksel HTML’e kıyasla daha az karmaşa meydana getirir.
Daha Az Kod: Aynı çıktıyı elde ederken genellikle daha az kod satırı yazarsınız, bu da görünüm dosyalarınızı okunması ve bakımı kolay hale getirir.
Artırılmış Okunabilirlik: Haml’ın yapısı, düzen ve tasarımın önemini vurgular, geliştiricilerin hataları bulmasını veya görünüm akışını anlamasını kolaylaştırır.

Sonuç

Haml’de bir dinamik sınıf değeri ayarlamak, ERB sözdiziminden yapılan basit bir ayarlama ile gerçekleştirilebilir. Sınıf öznitelikleri için hash sözdizimini ve Ruby’nin dinamik içerik eklemeyi kullanarak, işlevselliği korumakla kalmaz, aynı zamanda okunabilirliği de artırırsınız.