Sağlam bir frontend nasıl oluşturulur: kademeli geliştirme
-
HTML ile başlayın
- Kamu hizmetleri yalnızca HTML ile de işlevsel olmalıdır
- HTML katmanı hata toleranslıdır; bu sayede eski tarayıcılarda da çalışabilir
- Doğru semantik işaretleme kullanılmalı ve belge yapısı mantıklı biçimde kurgulanmalıdır
-
CSS kullanımı
- Hizmet, CSS kullanılarak stillendirilebilir
- CSS katmanı, tek tek bildirimleri yok sayabilen hata toleranslı bir yapıya sahiptir
CSS-in-JSgibi tekniklerden kaçınılmalıdır
-
JavaScript kullanımı
- JavaScript, etkileşimli öğeler eklemek için kullanılır
- JavaScript katmanı hata toleranslı değildir ve hatalar oluşabilir
- Tarayıcı API'leri için özellik algılama, polyfill ekleme ve transpile etme gibi yöntemlerle uyumluluk artırılabilir
- JavaScript, HTML ve CSS'yi tamamlayıcı bir rol üstlenmelidir
-
JavaScript alternatifleri
- Kullanıcı ihtiyaçlarını JavaScript olmadan da karşılayabilecek basit çözümler değerlendirilmelidir
- Alternatifler arasında veri tabloları gösterimi, veriyi dışa aktarma ve grafiklerin önceden görüntü olarak render edilmesi yer alır
-
İstemci tarafı JavaScript framework'leri kullanımı
- Karmaşık bir kullanıcı arayüzü söz konusu değilse framework kullanımından kaçınılmalıdır
- Framework kullanımı; kod tabanının büyümesi, performans sorunları ve üçüncü taraf koda bağımlılık gibi problemlere yol açabilir
- Framework kullanıldığında, her kullanıcı arayüzü ayrı bir bileşen olarak tasarlanmalıdır
-
CSS veya JavaScript'in yüklenmemesi ya da çalışmamasının nedenleri
- Ağ hataları, tarayıcı eklentileri, üçüncü taraf sağlayıcı kesintileri, DNS sorgulama başarısızlıkları ve tarayıcı güncellemelerinin neden olduğu hatalar buna sebep olabilir
- Bazı kullanıcılar tarayıcı özelliklerini bilinçli olarak devre dışı bırakabilir
-
Tek sayfa uygulamaları (SPA)
- Hizmetler tek sayfa uygulaması olarak geliştirilmemelidir
- SPA'ler erişilebilirliği zayıflatabilir; sayfalar arası geçişte odak yönetimi sorunları, geri/ileri düğmelerinin kullanılamaması gibi problemler doğurabilir
-
Hizmet testi
- JavaScript'e veya JavaScript framework'lerine büyük ölçüde bağımlı bileşenler, farklı tarayıcı ve cihazlarda çalışmalıdır
- Erişilebilirlik açısından test edilmelidir
-
Vaka çalışmaları ve ilgili kılavuzlar
- Neden kademeli geliştirme kullanılmalı
- Farklı cihazlar için tasarım
- Frontend performansı nasıl test edilir
- WCAG 2.2'yi anlama
GN⁺ özeti
- Kademeli geliştirme, web sitesini HTML, CSS ve JavaScript sırasıyla inşa etme yaklaşımıdır
- Bu yöntem, hizmetin hata toleransını artırır ve farklı tarayıcılar ile cihazlarda çalışmasını sağlar
- JavaScript tamamlayıcı bir rol oynamalı ve alternatif çözümler değerlendirilmelidir
- Tek sayfa uygulamalarından, erişilebilirlik sorunları nedeniyle kaçınılmalıdır
- Hizmet testi, farklı ortamlarda erişilebilirliğin güvence altına alınmasını sağlamalıdır
1 yorum
Hacker News görüşü
JavaScript framework'leri kullanırken, bunun kullanıcıya ne fayda sağladığını kanıtlayabilmek gerekir
SPA'lerin dezavantajları olarak gösterilen noktalar
Keşke tüm internet bu tavsiyeye uysa
Basit çözümlere öncelik verilmesi gerekir
Linux'un neden listede olmadığını merak ediyorum
Görünüşe göre birçok kişi bu yaklaşımı beğeniyor
HTML ve sunucuda önceden alınmış veriler kullanılıyor, istemcide yapılabilecek işler de istemcide yapılıyor
Birçok SPA sorunlu ama tüm SPA'ler sorunlu değil
Sunucu tarafı render da her durumda iyi değildir