Arkadaşlar merhaba, uzun zamandır kendi tasarım sistemimi oluşturmaya çalışıyorum. Özellikle frontend tarafında bileşenleri isimlendirirken sürekli bir ikilem yaşıyorum. Kimi zaman BEM metodolojisine sadık kalıp "block__element--modifier" yapısını kullanıyorum, kimi zaman da Atomic Design'ın "atoms, molecules, organisms" hiyerarşisine göre ilerliyorum. Ama asıl sorun, proje büyüdükçe bu isimlendirmelerin tutarlı kalmasını sağlamak oluyor. Mesela bir "card" bileşenine "card" mı demeli, yoksa "product-card" veya "ui-card" gibi bir ön ek mi eklemeli? Hangisi daha sürdürülebilir oluyor sizce?
Bir de şöyle bir durum var: Takım içinde herkesin farklı bir alışkanlığı oluyor. Ben "ButtonPrimary" gibi PascalCase kullanırken, bir başka geliştirici "button--primary" şeklinde kebab-case tercih edebiliyor. CSS tarafında bu çok sorun olmasa da, özellikle React veya Vue gibi framework'lerde component isimlendirmeleri ile stil isimlendirmeleri arasında kopukluk yaşanıyor. Siz bu uyumu nasıl sağlıyorsunuz? Yoksa tamamen ayrı bir isimlendirme stratejisi mi izliyorsunuz?
Son olarak, bileşenlerin varyasyonlarını isimlendirirken de zorlanıyorum. Örneğin bir butonun "küçük, büyük, birincil, ikincil, outline" gibi halleri var. Bunları "btn-sm, btn-lg, btn-primary, btn-secondary, btn-outline" şeklinde mi adlandırmak daha doğru, yoksa "ButtonSmall, ButtonPrimary" gibi daha açıklayıcı isimler mi kullanıyorsunuz? Deneyimlerinizi ve varsa kendi oluşturduğunuz standartları duymak isterim. Hadi bakalım, tartışalım.
Bir de şöyle bir durum var: Takım içinde herkesin farklı bir alışkanlığı oluyor. Ben "ButtonPrimary" gibi PascalCase kullanırken, bir başka geliştirici "button--primary" şeklinde kebab-case tercih edebiliyor. CSS tarafında bu çok sorun olmasa da, özellikle React veya Vue gibi framework'lerde component isimlendirmeleri ile stil isimlendirmeleri arasında kopukluk yaşanıyor. Siz bu uyumu nasıl sağlıyorsunuz? Yoksa tamamen ayrı bir isimlendirme stratejisi mi izliyorsunuz?
Son olarak, bileşenlerin varyasyonlarını isimlendirirken de zorlanıyorum. Örneğin bir butonun "küçük, büyük, birincil, ikincil, outline" gibi halleri var. Bunları "btn-sm, btn-lg, btn-primary, btn-secondary, btn-outline" şeklinde mi adlandırmak daha doğru, yoksa "ButtonSmall, ButtonPrimary" gibi daha açıklayıcı isimler mi kullanıyorsunuz? Deneyimlerinizi ve varsa kendi oluşturduğunuz standartları duymak isterim. Hadi bakalım, tartışalım.