Sadece CSS kullanarak kırmızı, mavi ve gri bloklar oluşturun (işaretlemeyi değiştirmeden, sarmal eklemeden). Bloklar, resimdeki örneğe göre düzenlenmelidir. Konteyner ve bloklara stil verebilirsiniz.
Frontend
Veri (source), alanlar (fields), filtre (filter) ve sıralama (order) alan bir mapper fonksiyonu uygulayın. Gereklidir: parametreleri doğrulamak (fields bir dizi olmalı, source/filter/order fonksiyonlar olmalı, fields içindeki alanlar verilerde bulunmalı), source() çağrısı ile verileri almak, filter ile filtrelemek, order ile sıralamak ve sadece fields içindeki istenen alanları döndürmek.
Sadece DOM API'yi (React olmadan, document aracılığıyla) kullanarak, herhangi bir dikdörtgene tıklandığında rengini gösteren bir kod yazın. Tüm öğeler için tek bir olay işleyici kullanmak tercih edilir. event.target ile event.currentTarget arasındaki fark nedir?
Veri değişimi yapan, string fonksiyon çağıran ve liste gösteren React bileşeninin kod incelemesini yapın. Tüm hataları ve sorunları bulun ve düzeltin (useEffect'te async, bağımlılık dizisinin olmaması, anahtar olarak indeks kullanımı vb.).
Queue sınıfının run metodunu, kullanım örneğine uygun olacak şekilde uygulayın. run metodu, kendisine iletilen asenkron fonksiyonları sıralı olarak çalıştırmalıdır. Kuyruktaki bir sonraki fonksiyon, yalnızca next çağrıldıktan sonra çağrılabilir. Bir fonksiyonda hata oluşursa, sonraki fonksiyonlar çağrılmaz. Metotlar zincirleme (chaining) desteği sağlamalıdır.
Bir Add düğmesi olan bir React bileşeni yazın. Add düğmesine tıklandığında, sıralı numaraya sahip yeni bir düğme eklenir. Oluşturulan düğmeye tıklandığında, o düğme kaldırılır. Kaldırma doğru şekilde çalışmalıdır (indeks değil, benzersiz kimlik ile).
asyncFilter fonksiyonunu uygulayın, bu fonksiyon bir sayı dizisi ve asenkron bir öncül fonksiyonu alır ve filtrelenmiş bir dizi döndürür. Örneğin, giriş [1, 2, 3] ve yalnızca tek sayıları bırakan bir fonksiyon ile çıktı [1, 3] olmalıdır.