Δημιουργήστε μπλοκ κόκκινο, μπλε και γκρι χρησιμοποιώντας μόνο CSS (χωρίς να αλλάξετε τη δομή, χωρίς να προσθέσετε περιτυλίγματα). Τα μπλοκ πρέπει να τοποθετηθούν σύμφωνα με το παράδειγμα στην εικόνα. Μπορείτε να ορίσετε στυλ για το κοντέινερ και τα ίδια τα μπλοκ.
Frontend
Υλοποιήστε μια λειτουργία mapper που δέχεται δεδομένα (source), πεδία (fields), φίλτρο (filter) και ταξινόμηση (order). Είναι απαραίτητο: να επικυρώσετε τις παραμέτρους (fields πρέπει να είναι πίνακας, source/filter/order είναι συναρτήσεις, τα πεδία στο fields πρέπει να υπάρχουν στα δεδομένα), να λάβετε τα δεδομένα μέσω της κλήσης source(), να φιλτράρετε μέσω filter, να ταξινομήσετε μέσω order και να επιστρέψετε μόνο τα ζητούμενα πεδία από τα fields.
Πραγματοποιήστε μια ανασκόπηση κώδικα ενός React component που πραγματοποιεί εναλλαγή δεδομένων, καλεί μια λειτουργία συμβολοσειράς και εμφανίζει μια λίστα. Βρείτε και διορθώστε όλα τα σφάλματα και τα προβλήματα (async στο useEffect, απουσία πίνακα εξαρτήσεων, χρήση δείκτη ως key κ.λπ.).
Χρησιμοποιώντας μόνο το API DOM (χωρίς React, μέσω του document), γράψτε κώδικα όπου το κλικ σε οποιοδήποτε από τα ορθογώνια εμφανίζει το χρώμα του. Συνιστάται να χρησιμοποιείτε έναν μόνο διαχειριστή συμβάντων για όλα τα στοιχεία. Ποια είναι η διαφορά μεταξύ event.target και event.currentTarget;
Υλοποιήστε τη μέθοδο run της κλάσης Queue έτσι ώστε η υλοποίηση να αντιστοιχεί στο παράδειγμα χρήσης. Η μέθοδος run πρέπει να εκτελεί διαδοχικά τις ασύγχρονες συναρτήσεις που της δίνονται. Η επόμενη λειτουργία στη σειρά μπορεί να κληθεί μόνο μετά την κλήση της next. Αν προκύψει σφάλμα σε μία από τις συναρτήσεις, οι επόμενες δεν καλούνται. Οι μέθοδοι πρέπει να υποστηρίζουν αλυσίδα κλήσεων (chaining).
Γράψτε ένα React συστατικό με ένα κουμπί Προσθήκη. Όταν πατάτε το κουμπί Προσθήκη, προστίθεται ένα νέο κουμπί με αριθμό σειράς. Όταν πατάτε το δημιουργημένο κουμπί, διαγράφεται. Η διαγραφή πρέπει να λειτουργεί σωστά (όχι με το δείκτη, αλλά με μοναδικό αναγνωριστικό).
Υλοποιήστε τη συνάρτηση asyncFilter, η οποία λαμβάνει έναν πίνακα αριθμών και μια ασύγχρονη συνάρτηση προ predicate, και επιστρέφει έναν φιλτραρισμένο πίνακα. Για παράδειγμα, με είσοδο [1, 2, 3] και μια συνάρτηση που αφήνει μόνο τους περιττούς αριθμούς, η έξοδος πρέπει να είναι [1, 3].