Σήμερα άνοιξε μια νέα εγγραφή στη Μόσχα. Το πρώτο στάδιο της εκπαίδευσης θα πραγματοποιηθεί από τις 7 Σεπτεμβρίου έως τις 25 Οκτωβρίου. Φοιτητές από άλλες πόλεις θα μπορούν να συμμετέχουν σε αυτό εξ αποστάσεως ή αυτοπροσώπως - η εταιρεία θα πληρώσει για ταξίδια και διαμονή σε ξενώνα. Το δεύτερο, επίσης τελικό στάδιο, θα διαρκέσει έως τις 3 Δεκεμβρίου, μπορεί να ολοκληρωθεί μόνο αυτοπροσώπως.
Ονομάζομαι Yulia Seredich, γράψαμε αυτήν την ανάρτηση μαζί με τον Sergei Kazakov. Είμαστε και οι δύο προγραμματιστές διεπαφής στο γραφείο της Yandex στο Μινσκ και απόφοιτοι SRI προηγούμενων ετών.
Με αφορμή το άνοιγμα των εγγραφών στη Μόσχα, δημοσιεύουμε μια ανάλυση των εισαγωγικών εργασιών στο προηγούμενο Σχολείο - εδώ στο Μινσκ.
Εάν παρακολουθείτε την ιστορία των εργασιών SRI, από χρόνο σε χρόνο δοκιμάσαμε τρεις σημαντικές δεξιότητες για έναν προγραμματιστή:
- Διάταξη. Κάθε προγραμματιστής θα πρέπει να μπορεί να κάνει διάταξη. Δεν συμβαίνει να έχετε τον θείο Seryozha που σχεδιάζει για όλη την ομάδα και γράφετε μόνο σενάρια. Επομένως, κάθε μαθητής πρέπει να δείξει πώς ξέρει να στοιχειοθετεί.
- JavaScript. Αν το θέμα περιοριζόταν στο layout, τότε δεν θα είχαμε Σχολή Ανάπτυξης Διασύνδεσης, αλλά Σχολή Σχεδιαστών Διατάξεων. Η όμορφα σχεδιασμένη διεπαφή πρέπει να αναβιώσει. Επομένως, υπάρχει πάντα μια εργασία για το JS, αλλά μερικές φορές είναι επίσης μια εργασία για αλγόριθμους - τους αγαπάμε τόσο πολύ.
- Η επίλυση προβλημάτων είναι ίσως η πιο σημαντική ικανότητα ενός προγραμματιστή. Όταν πρόκειται για τη δημιουργία διεπαφών, τα πράγματα αλλάζουν πολύ γρήγορα. Είναι σαν τον Lewis Carroll: «Πρέπει να τρέχεις όσο πιο γρήγορα μπορείς για να μείνεις στο ίδιο μέρος και για να φτάσεις σε άλλο μέρος πρέπει να τρέξεις δύο φορές πιο γρήγορα». Κάθε μέρα συναντάμε νέες τεχνολογίες - πρέπει να τις λαμβάνουμε υπόψη και να μπορούμε να τις κατανοούμε. Ως εκ τούτου, στην τρίτη εργασία, προτείναμε να κατανοήσουμε τεχνολογίες με τις οποίες ένας αρχάριος προγραμματιστής συνήθως δεν είναι εξοικειωμένος.
Στην ανάλυση κάθε εργασίας, θα σας πούμε όχι μόνο για τη σωστή διαδικασία, αλλά και για κοινά λάθη.
Εργασία 1: Χαρτοφυλάκιο
Το πρώτο έργο εργάστηκε από τον σχεδιαστή της Yandex.Collections Alexey Cherenkevich, ο οποίος ξέρει πώς να κάνει τη διάταξη, και τον συνάδελφό του, τον προγραμματιστή διεπαφής Sergey Samsonov.
Κατάσταση
Δημιουργήστε έναν ιστότοπο χαρτοφυλακίου: πείτε μας για εσάς, τη δουλειά σας και τις προσδοκίες σας από τη Σχολή. Ο ιστότοπος πρέπει να αντιστοιχεί όσο το δυνατόν περισσότερο στην προτεινόμενη διάταξη (σύνδεσμοι προς διατάξεις: , , , ). Μας ενδιαφέρει μόνο η διάταξη, γι' αυτό μην χρησιμοποιείτε JavaScript.
Κατά τον έλεγχο θα λάβουμε υπόψη:
- Μεγέθη εσοχών, ορθότητα χρώματος, στυλ γραμματοσειράς, μέγεθος γραμματοσειράς.
- σημασιολογική διάταξη?
- την παρουσία διαφορετικών καταστάσεων στοιχείων: εμφάνιση κουμπιών και συνδέσμων κατά την αιώρηση του δρομέα, επισήμανση ενεργών πεδίων εισαγωγής κ.λπ.
- συμβατότητα μεταξύ προγραμμάτων περιήγησης (δοκιμάστηκε στις τελευταίες εκδόσεις δημοφιλών προγραμμάτων περιήγησης).
Το πλεονέκτημα θα είναι:
- χρήση σύγχρονων λύσεων CSS: flexbox, grid κ.λπ.
- Προσαρμοστική διάταξη.
- χρήση προ- και (ή) μετα-επεξεργαστών, συναρμολόγηση, ελαχιστοποίηση, βελτιστοποίηση του κώδικα εξόδου.
- Επικύρωση φόρμας HTML, στυλιζαρισμένο κουμπί μεταφόρτωσης αρχείου.
Η εργασία είναι αρκετά ογκώδης, επομένως μπορείτε να παραλείψετε ό,τι δεν θα λειτουργήσει. Αυτό θα μειώσει ελαφρώς τη βαθμολογία σας, αλλά θα εξακολουθείτε να μπορείτε να επιδείξετε τις γνώσεις σας. Όταν τελειώσετε, στείλτε μας δύο συνδέσμους - προς το χαρτοφυλάκιό σας και τον πηγαίο κώδικα στο GitHub.
Οι διατάξεις που προτάθηκαν στην εργασία δεν ήταν μόνο με οθόνες για φορητές συσκευές, tablet και επιτραπέζιους υπολογιστές, αλλά και με πραγματικές προδιαγραφές.
Προκειμένου να υπάρξει όσο το δυνατόν μεγαλύτερη αντικειμενικότητα στο αποτέλεσμα του ελέγχου της πρώτης εργασίας, υπήρχαν πολλά κριτήρια για αυτόν τον έλεγχο.
Κριτήρια
Σχεδιασμένος ιστότοπος. Αυτό φαίνεται προφανές, αλλά μερικοί τύποι παρέλειψαν εντελώς ορισμένα μπλοκ - είτε ήθελαν να εξοικονομήσουν χρόνο είτε δεν μπορούσαν να τα κάνουν. Η διάταξη μπορεί να χωριστεί χονδρικά σε τέσσερις κύριες οθόνες: την κύρια οθόνη με ένα avatar, ένα μπλοκ με μια λίστα προσδοκιών από το SRI, ένα μπλοκ με ένα χαρτοφυλάκιο και ένα μπλοκ με στοιχεία επικοινωνίας. Θα μπορούσαν να γίνουν σε τμήματα ή απλά χρησιμοποιώντας div, το κύριο πράγμα είναι ότι και τα τέσσερα μπλοκ ήταν διαθέσιμα.
Συμμόρφωση διάταξης με διάταξη. Ο σχεδιαστής έκανε μια ξεχωριστή προδιαγραφή (συμπεριλαμβανομένων των χρωμάτων, της τυπογραφίας, των καταστάσεων κουμπιών κ.λπ.) για να διευκολύνει τους υποψηφίους. Στο κάτω μέρος υπήρχε μια υπόδειξη για τις εσοχές και τα χαρακτηριστικά της πρώτης οθόνης. Ήμουν πολύ ευχαριστημένος με τα παιδιά που έλαβαν υπόψη όλες τις επιθυμίες του σχεδιαστή: για παράδειγμα, η πρώτη οθόνη δεν θα έπρεπε να είναι μικρότερη από το ύψος της θύρας προβολής.
Προσαρμοστική διάταξη - αυτό συμβαίνει όταν η διεπαφή δεν είναι απλά διαρρυθμισμένη έτσι ώστε σε τρεις αναλύσεις τα πάντα να είναι pixel σε pixel στη διάταξη. Σε ενδιάμεσες καταστάσεις, η διάταξη δεν πρέπει επίσης να καταρρέει. Μερικοί ξέχασαν να περιορίσουν το μέγιστο πλάτος του κοντέινερ και έβαλαν τα πάντα στα 1920 pixel, κάποιοι μπέρδεψαν το φόντο, αλλά συνολικά οι υποψήφιοι αντιμετώπισαν καλά αυτό το έργο.
Σημασιολογική διάταξη. "Πόσες φορές είπαν στον κόσμο" ότι ο σύνδεσμος πρέπει να σχεδιαστεί ως , το κουμπί - ως . Ευτυχώς, οι περισσότεροι υποψήφιοι πληρούσαν και αυτή την προϋπόθεση. Δεν αναγνώρισαν όλοι την κρυφή λίστα στις προσδοκίες του SRI, κάνοντάς την χρησιμοποιώντας ετικέτες div, αλλά δεν είναι τόσο κακό. Υπήρχε ένας υποψήφιος που έβαλε όλες τις σημασιολογικές ετικέτες που ήξερε - όπου ήταν απαραίτητο και όπου δεν ήταν απαραίτητο. Για παράδειγμα, αντί για λίστα - και . Εξάλλου, η σημασιολογία - έχει να κάνει με την κατανόηση της σύνθεσης της σελίδας σας και του σκοπού κάθε μπλοκ (η πλειοψηφία το κατάφερε εδώ), καθώς και τη χρήση προ- ή/και μετα-επεξεργαστών (μερικοί το κατάφεραν εδώ, αν και αυτό ήταν επίσης στα σημεία - πιο συχνά χρησιμοποιούσαν λιγότερο και scss) .
Ρυθμιστικό εργασίας. Στην εργασία γράψαμε ότι το JS δεν μπορεί να χρησιμοποιηθεί. Εδώ δοκιμάστηκε η ικανότητα επίλυσης προβλημάτων - ένα ρυθμιστικό θα μπορούσε να κατασκευαστεί χρησιμοποιώντας ένα μάτσο Και . Όλη η μαγεία συμβαίνει στο επίπεδο επιλογέα #button-N:checked ~ .slider-inner .slider-slides. Όταν κάνουμε κλικ σε ένα από τα πλαίσια ελέγχου εισαγωγής, μεταβαίνει σε επιλεγμένη κατάσταση. Μπορούμε να το εκμεταλλευτούμε αυτό και να αντιστοιχίσουμε τη μετάφραση που χρειαζόμαστε στο κοντέινερ με τις διαφάνειες: transform: translate(-33%). Μπορείτε να δείτε την υλοποίηση του ρυθμιστικού .
Αναπτυσσόμενες λίστες. Εδώ κατέληξαν όλα επίσης και παρόμοιος επιλογέας: .accordion-item input:checked ~ .accordion-item__content. Μπορείτε να δείτε την υλοποίηση .
Διαθεσιμότητα καταστάσεων :hover, :active και :focu*. Ένα πολύ σημαντικό σημείο. Η άνεση κατά την αλληλεπίδραση με τη διεπαφή εξαρτιόταν από αυτήν. Ο χρήστης πρέπει πάντα να λαμβάνει ανατροφοδότηση για τις ενέργειές του. Αυτό το στοιχείο ελέγχθηκε καθ' όλη τη διάρκεια της αλληλεπίδρασης με το ερωτηματολόγιο. Εάν έκανα κλικ στο κουμπί "Καλέστε με" και οπτικά δεν συνέβη τίποτα (παρόλο που το αίτημα στάλθηκε), αυτό είναι κακό, γιατί θα το κάνω ξανά και ξανά κλικ. Ως αποτέλεσμα, θα σταλούν δέκα αιτήματα και θα με καλέσουν δέκα φορές. Δεν πρέπει να ξεχνάμε ότι οι φορητές συσκευές δεν διαθέτουν ποντίκι, πράγμα που σημαίνει ότι δεν πρέπει να υπάρχει αιώρηση. Και ένα ακόμη σημείο που δεν επηρέασε αυτούς που εκπλήρωσαν το σημείο για τη σημασιολογία. Εάν το στοιχείο ελέγχου σας δεν είναι διαδραστικό στοιχείο, τότε όταν τοποθετείτε το δείκτη του ποντικιού πάνω του, ο κέρσορας θα παραμείνει βασικός. Φαίνεται πολύ ακατάστατο, ακόμα κι αν έχετε γράψει μια αντίδραση στο hover. Μην υποτιμάτε δρομέα: δείκτη.
Κινούμενα σχέδια. Είναι σημαντικό όλες οι αντιδράσεις που συμβαίνουν με τα στοιχεία να είναι ομαλές. Τίποτα στη ζωή δεν είναι στιγμιαίο, επομένως οι μεταβάσεις σε λειτουργία hover και ενεργές ήταν αρκετές για να κάνουν τη διεπαφή πιο ευχάριστη. Λοιπόν, αυτοί που έκαναν κίνηση στο ρυθμιστικό και τις λίστες είναι γενικά υπέροχοι.
Χρησιμοποιώντας την τελευταία λέξη της τεχνολογίας. Πολλοί άνθρωποι χρησιμοποίησαν το flex, αλλά κανείς δεν ολοκλήρωσε την εργασία χρησιμοποιώντας το πλέγμα. Ο βαθμός μετρήθηκε εάν το flex χρησιμοποιήθηκε σωστά. Αν κάπου η διάταξη διαλύθηκε εξαιτίας αυτών των ίδιων ευκαμψιών, δυστυχώς, δεν λάβατε επιπλέον βαθμούς.
Επικύρωση φόρμας. Το μόνο που χρειαζόταν ήταν να προστεθεί το απαιτούμενο χαρακτηριστικό σε κάθε είσοδο της φόρμας. Προσθέσαμε πόντους σε όσους επικύρωσαν το πεδίο email ως email.
Προσαρμογή του κουμπιού μεταφόρτωσης αρχείου. Περιμέναμε να δούμε έναν συνδυασμό όπως: και Επιλογή αρχείου . Στη συνέχεια έπρεπε να αποκρύψουμε την είσοδο και να διαμορφώσουμε την ετικέτα. Υπάρχει ένας άλλος συνηθισμένος τρόπος - να κάνετε μια διαφανή είσοδο και να την τοποθετήσετε στην κορυφή του κουμπιού. Αλλά δεν επιτρέπουν όλα τα προγράμματα περιήγησης το στυλ , και μια τέτοια λύση δεν μπορεί να ονομαστεί πλήρως cross-browser. Και σημασιολογικά είναι πιο σωστό να κάνεις ετικέτα.
Συμβατότητα μεταξύ προγραμμάτων περιήγησης. Ελέγξαμε ότι όλα ήταν εντάξει στις δύο τελευταίες εκδόσεις των σύγχρονων προγραμμάτων περιήγησης (χωρίς IE - οι συμμετέχοντες ήταν τυχεροί), καθώς και στο Safari σε iPhone και στο Chrome σε Android.
Αντίθετα, αφαιρέσαμε πόντους εάν κάποιος χρησιμοποιούσε JS ή Bootstrap: και οι δύο θα νικούσαν τον σκοπό της όλης εργασίας. Επιπλέον, οι συμμετέχοντες με Bootstrap όχι μόνο έλαβαν ένα μείον, αλλά έχασαν και πολλούς βαθμούς για τη σημασιολογία και τα εφαρμοσμένα στοιχεία.
Όσοι φιλοξενούσαν τον ιστότοπό τους κάπου στο Διαδίκτυο δεν είχαν κάποιο ιδιαίτερο πλεονέκτημα - αλλά οι κριτικοί ήταν πολύ χαρούμενοι όταν δεν χρειάστηκε να κατεβάσουν αποθετήρια και να τα τρέξουν τοπικά στον υπολογιστή τους. Αυτό λοιπόν χρησίμευσε ως συν για το κάρμα.
Η πρώτη εργασία ήταν πολύ χρήσιμη κυρίως για τον μαθητή. Όσοι δεν αποδεχθήκαμε έχουν τώρα ένα έτοιμο βιογραφικό - μπορείτε να το επισυνάψετε με υπερηφάνεια σε όλες τις απαντήσεις ή να το δημοσιεύσετε στις gh-σελίδες σας.
Εργασία 2: Διαδρομή μεταφοράς
Ο συγγραφέας της εργασίας είναι ο επικεφαλής της ομάδας διεπαφών αναζήτησης Denis Balyko.
Κατάσταση
Έχετε χάρτη αστεριών; Δείχνει το όνομα κάθε αστεριού, καθώς και την απόσταση από αυτό σε άλλα αστέρια σε δευτερόλεπτα φωτός. Εφαρμόστε τη συνάρτηση λύσης, η οποία θα πρέπει να λάβει τρία ορίσματα: ένα αντικείμενο στο οποίο τα κλειδιά είναι τα ονόματα των αστεριών και οι τιμές είναι οι αποστάσεις από τα αστέρια (μονόδρομη κυκλοφορία στο διάστημα), καθώς και τα ονόματα των τα σημεία έναρξης και λήξης της διαδρομής - αρχή και τερματισμός, αντίστοιχα. Η συνάρτηση θα πρέπει να επιστρέφει τη μικρότερη απόσταση από το αστέρι εκκίνησης στο αστέρι τερματισμού και τη διαδρομή που πρέπει να ακολουθήσετε.
Υπογραφή λειτουργίας:
const solution = function(graph, start, finish) { // Ваше решение }Παράδειγμα δεδομένων εισόδου:
const graph = { start: { A: 50, B: 20 }, A: { C: 40, D: 20 }, B: { A: 90, D: 90 }, C: { D: 160, finish: 50 }, D: { finish: 20 }, finish: {} }; const start = 'start'; const finish = 'finish';Παράδειγμα εξόδου:
{ distance: 90, path: ['start', 'A', 'D', 'finish'] }Σημείωση: Ο σκελετός της λύσης βρίσκεται στο φάκελο src/, βάλτε τη λύση σας στο solution.js.
Η επαλήθευση της δεύτερης εργασίας ήταν η πιο αυτοματοποιημένη και αντικειμενική. Τα περισσότερα παιδιά μάντευαν ότι ήταν απαραίτητο να εφαρμοστεί ο αλγόριθμος του Dijkstra. Όσοι βρήκαν την περιγραφή του και υλοποίησαν τον αλγόριθμο στο JS μπράβο τους. Ωστόσο, κατά τον έλεγχο της εργασίας, συναντήσαμε πολλά χαρτιά με τα ίδια λάθη. Ψάξαμε στο Διαδίκτυο για κομμάτια κώδικα και βρήκαμε ένα άρθρο από το οποίο οι συμμετέχοντες αντέγραψαν τον αλγόριθμο. Είναι αστείο που πολλοί άνθρωποι αντέγραψαν τον κώδικα από το άρθρο μαζί με τα σχόλια του συγγραφέα. Τέτοια έργα έλαβαν χαμηλή βαθμολογία. Δεν απαγορεύουμε τη χρήση οποιασδήποτε πηγής, αλλά θέλουμε ο άνθρωπος να εμβαθύνει σε αυτά που γράφει.
Κριτήρια
Οι κύριοι βαθμοί απονεμήθηκαν για τις δοκιμές. Μερικές φορές ήταν ξεκάθαρο ότι τα παιδιά μπέρδευαν με το αποθετήριο, μετονομάζονταν φακέλους και οι δοκιμές αποτυγχάνουν απλώς και μόνο επειδή δεν μπορούσαν να βρουν τα απαραίτητα αρχεία. Φέτος προσπαθήσαμε να βοηθήσουμε τέτοια παιδιά και τα επιστρέψαμε όλα στη θέση τους. Αλλά τον επόμενο χρόνο σκοπεύουμε να μεταβούμε σε ένα σύστημα διαγωνισμών, και αυτό δεν θα συγχωρεθεί πλέον.
Υπήρχαν και «ανθρώπινα», χειρωνακτικά κριτήρια. Για παράδειγμα, η παρουσία ενός ενιαίου στυλ κώδικα. Κανείς δεν αφαίρεσε βαθμούς για τη χρήση καρτελών αντί για κενά ή το αντίστροφο. Είναι άλλο θέμα αν εναλλάσσετε μονά εισαγωγικά με διπλά εισαγωγικά σύμφωνα με έναν γνωστό σας κανόνα και τοποθετείτε ερωτηματικά τυχαία.
Η σαφήνεια και η αναγνωσιμότητα του διαλύματος λήφθηκαν υπόψη ξεχωριστά. Σε όλα τα συνέδρια στον κόσμο λένε ότι το 80% της δουλειάς ενός προγραμματιστή συνίσταται στην ανάγνωση του κώδικα άλλων ανθρώπων. Ακόμη και οι μαθητές υποβάλλονται σε αναθεωρήσεις κώδικα - από τους επιμελητές τους και ο ένας από τον άλλο. Άρα αυτό το κριτήριο είχε σημαντική βαρύτητα. Υπήρξαν έργα στα οποία δεν υπήρχαν μεταβλητές μεγαλύτερες από έναν χαρακτήρα - μην το κάνετε αυτό. Τα σχόλια των συμμετεχόντων ήταν πολύ ενθαρρυντικά - με εξαίρεση εκείνα που ήταν πανομοιότυπα με τα σχόλια της Stella Chang.
Το τελευταίο κριτήριο είναι η παρουσία αυτοδοκιμών. Μόνο λίγοι τα πρόσθεσαν, αλλά για όλους έγινε ένα τεράστιο συν στο κάρμα τους.
Σωστή λύση:
const solution = function(graph, START, FINISH) {
// Всё не бесплатно в этом мире
const costs = Object.assign({[FINISH]: Infinity}, graph[START]);
// Первая волна родительских нод
const parents = { [FINISH]: null };
Object.keys(graph[START]).reduce((acc, child) => (acc[child] = START) && acc, parents)
const visited = [];
let node;
// Ищем «дешёвого» родителя, отмечаем пройденные
do {
node = lowestCostNode(costs, visited);
let children = graph[node];
for (let n in children) {
let newCost = costs[node] + children[n];
// Ещё не оценена или нашёлся более дешёвый переход
if (!costs[n] || costs[n] > newCost) {
costs[n] = newCost;
parents[n] = node;
}
}
visited.push(node);
} while (node)
return {
distance: costs[FINISH],
path: optimalPath(parents)
};
// Возврат назад по самым «дешёвым» родителям
function optimalPath(parents) {
let optimalPath = [FINISH];
let parent = parents[FINISH];
while (parent && parent !== START) {
optimalPath.push(parent);
parent = parents[parent];
}
optimalPath.push(START);
return optimalPath.reverse();
}
// Минимальная стоимость из текущей ноды среди непросмотренных
function lowestCostNode(costs, visited) {
return Object.keys(costs).reduce((lowest, node) => {
if (lowest === null || costs[node] < costs[lowest]) {
if (!visited.includes(node)) {
lowest = node;
}
}
return lowest;
}, null);
};
};Εργασία 3: Ημερολόγιο συμβάντων
Ετοιμάστηκε από τους προγραμματιστές διεπαφής Sergey Kazakov και Alexander Podskrebkin.
Κατάσταση
Γράψτε ένα μίνι ημερολόγιο για να εμφανίσετε το πρόγραμμά σας. Μπορείτε να πάρετε όποιο πρόγραμμα θέλετε. Για παράδειγμα, το πρόγραμμα των συνεδρίων frontend το 2019.
Το ημερολόγιο πρέπει να μοιάζει με λίστα. Δεν υπάρχουν άλλες απαιτήσεις σχεδιασμού. Δώστε τη δυνατότητα να ορίσετε υπενθυμίσεις συμβάντων 3, 7 και 14 ημέρες νωρίτερα. Μετά την πρώτη λήψη από το Διαδίκτυο, το ημερολόγιο θα πρέπει να ανοίξει και να λειτουργεί εκτός σύνδεσης.
Χρήσιμοι πόροι
Πρόγραμμα συνεδρίων Frontend:
Υπάλληλοι υπηρεσιών:
API ειδοποιήσεων:
Η τρίτη εργασία ήταν η πιο ενδιαφέρουσα για δοκιμή, γιατί υπήρχαν τόσες πολλές πιθανές λύσεις, η καθεμία με τις δικές της. Ελέγξαμε πώς χειρίζεται ο υποψήφιος άγνωστες τεχνολογίες - αν ξέρει να ερευνά, αν δοκιμάζει τις λύσεις του.
Κριτήρια
Διπλωμένο ημερολόγιο. Ναι, έπρεπε ακόμα να στρωθεί. Υπήρχαν επίσης εκείνοι που πήραν την κατάσταση υπερβολικά κυριολεκτικά και δεν εισήγαγαν ούτε μια γραμμή κώδικα CSS. Δεν φαινόταν πολύ ελκυστικό, αλλά αν όλα λειτουργούσαν, οι πόντοι δεν μειώθηκαν.
Λήψη λίστας συμβάντων από μια πηγή. Αυτή δεν είναι μια εργασία διάταξης, επομένως η λίστα των συμβάντων που περιλαμβάνονται σε αυτήν δεν καταμετρήθηκε. Μπορείτε πάντα να ακυρώσετε μια διάσκεψη, να την επαναπρογραμματίσετε ή να προσθέσετε μια νέα. Άρα ήταν απαραίτητο να λαμβάνουμε δεδομένα από το εξωτερικό και να αποδώσουμε τη διάταξη με βάση το ληφθέν JSON. Ήταν σημαντικό να ληφθούν τα δεδομένα με οποιονδήποτε τρόπο (χρησιμοποιώντας τη μέθοδο ανάκτησης ή χρησιμοποιώντας XMLHttpRequest). Εάν ένα άτομο πρόσθεσε ένα πολυγέμισμα για ανάκτηση και επισήμανε την επιλογή του στο readme, αυτό μετρήθηκε ως συν.
Εγγραφή υπαλλήλου σέρβις χωρίς σφάλματα και εργαστείτε εκτός σύνδεσης μετά την πρώτη λήψη. υπάλληλος σέρβις με προσωρινή αποθήκευση χρονοδιαγράμματος κατά την πρώτη εκκίνηση. Λεπτομέρειες σχετικά με τους υπαλλήλους υπηρεσιών, τις δυνατότητές τους και τους τρόπους συνεργασίας μαζί τους (στρατηγικές για εργασία με κρυφές μνήμες, εργασία εκτός σύνδεσης) μπορείτε να βρείτε εδώ.
Δυνατότητα ορισμού υπενθύμισηςέτσι ώστε να λειτουργεί πραγματικά μετά από 3, 7, 14 ημέρες. Ήταν απαραίτητο να κατανοήσουμε το API ειδοποιήσεων, ήταν σωστά στο καθήκον. Δεν περιμέναμε κάποια συγκεκριμένη εφαρμογή για να ελέγξουμε αν ήρθε η ώρα να πιέσουμε. Οποιαδήποτε επιλογή εργασίας έγινε αποδεκτή: αποθήκευση σε localStorage, IndexDB ή περιοδική δημοσκόπηση από υπάλληλο σέρβις. Ήταν ακόμη δυνατό να δημιουργηθεί ένας διακομιστής push (εδώ ), αλλά δεν θα λειτουργούσε εκτός σύνδεσης. Ήταν εξίσου σημαντικό να λάβετε μια ώθηση μετά το κλείσιμο της σελίδας - και το άνοιγμα μετά από κάποιο χρονικό διάστημα. Εάν η υπενθύμιση πέθανε την ίδια στιγμή που έκλεινε η σελίδα, η λύση δεν καταμετρήθηκε. Είναι ωραίο όταν τα παιδιά σκέφτηκαν τους κριτικούς και κατέστησαν δυνατή την ώθηση αυτή τη στιγμή - για να μην περιμένουν 3 ημέρες.
Δυνατότητα τοποθέτησης εικονιδίου στην επιφάνεια εργασίας (PWA). Ελέγξαμε την παρουσία του αρχείου με τα σωστά εικονίδια. Μερικοί τύποι έφτιαξαν αυτό το αρχείο (ή το άφησαν να δημιουργηθεί στο CreateReactApp) - αλλά δεν πρόσθεσαν τα σωστά εικονίδια. Στη συνέχεια, κατά την προσπάθεια εγκατάστασης, παρουσιάστηκε ένα σφάλμα όπως "χρειάζεται διαφορετικό εικονίδιο".
Codestyle και δομή έργου. Όπως και στη δεύτερη εργασία, εξετάσαμε ένα ενιαίο στυλ κώδικα (ακόμα και αν δεν συνέπεσε με το δικό μας). Μερικοί τύποι βιδώθηκαν σε λίτρα - αυτό είναι υπέροχο.
Σφάλματα κονσόλας. Εάν υπήρχε μια ένδειξη ακριβώς στην κονσόλα ότι κάτι δεν πήγαινε καλά και ο συμμετέχων δεν έδωσε σημασία σε αυτό, αφαιρέσαμε πόντους.
Αποτελέσματα της
Τι είναι αστείο με τις αποφάσεις των συμμετεχόντων:
- Ένα ερωτηματολόγιο περιείχε το ακόλουθο κείμενο: «Ένας φίλος προγραμματιστής με βοήθησε να φτιάξω μια εφαρμογή React. Τον βομβάρδισα με ερωτήσεις για το πώς και γιατί, και μου είπε. Μου άρεσε πολύ, θέλω να μάθω περισσότερα για αυτό». Βασιζόμασταν για αυτήν την εφαρμογή με όλη μας την καρδιά, αλλά δυστυχώς, ο φίλος του υποψηφίου δεν βοήθησε πολύ στο να λειτουργήσει η εφαρμογή.
- Ένας υποψήφιος έστειλε έναν σύνδεσμο στο GitHub, όπου βρισκόταν το αρχείο RAR - είναι δύσκολο να σχολιάσω αυτό. 🙂
- Ένας άλλος υποψήφιος, στο σχόλιο στην πρώτη γραμμή του αρχείου solution.js, παραδέχτηκε ειλικρινά ότι αντέγραψε τον αλγόριθμο.
Λάβαμε αιτήσεις από 76 υποψηφίους και επιλέξαμε 23 άτομα. Μας εστάλησαν ερωτηματολόγια όχι μόνο από το Μινσκ, αλλά και από τη Μόσχα, την Αγία Πετρούπολη, ακόμη και από το Ταταρστάν. Μερικοί από τους τύπους μας εξέπληξαν με τα σημερινά τους επαγγέλματα: ο ένας είναι ιατροδικαστής και ο άλλος φοιτητής ιατρικής.
Το αποτέλεσμα ήταν μια ενδιαφέρουσα κατανομή των ποσοστών επιτυχίας στην ολοκλήρωση των εργασιών. Οι συμμετέχοντες ολοκλήρωσαν την πρώτη εργασία κατά μέσο όρο κατά 60%, τη δεύτερη κατά 50%, και η τρίτη αποδείχθηκε ότι ήταν η πιο δύσκολη και ολοκληρώθηκε κατά μέσο όρο κατά 40%.
Με την πρώτη ματιά, οι εργασίες φαίνονται πολύπλοκες και χρονοβόρες. Ο λόγος δεν είναι ότι θέλουμε να εξαλείψουμε όσο το δυνατόν περισσότερους υποψηφίους. Κατά τη διάρκεια των σπουδών τους, οι μαθητές αντιμετωπίζουν εργασίες της πραγματικής ζωής - να κάνουν μια συνομιλία, Yandex.Music για παιδιά ή Yandex.Weather για άτομα που εξαρτώνται από τις καιρικές συνθήκες. Για αυτό χρειάζεστε μια βάση εκκίνησης.
Θυμάμαι ότι είδα την εργασία εισόδου στο SRI πριν από δύο χρόνια και σκέφτηκα ότι δεν θα το λύσω ποτέ. Το κύριο πράγμα αυτή τη στιγμή είναι να καθίσετε, να διαβάσετε προσεκτικά τις συνθήκες και να αρχίσετε να το κάνετε. Αποδεικνύεται ότι οι συνθήκες περιέχουν σχεδόν το 80% του διαλύματος. Για παράδειγμα, στην συνθήκη της τρίτης εργασίας (της πιο δύσκολης), προσθέσαμε συνδέσμους προς υπαλλήλους υπηρεσιών και το API ειδοποιήσεων στο MDN. Οι μαθητές που μελέτησαν τα περιεχόμενα των συνδέσμων το ολοκλήρωσαν χωρίς δυσκολία.
Θα ήθελα πολύ αυτό το άρθρο να διαβαστεί από υποψήφιους που σχεδιάζουν να εισέλθουν στο SRI στο μέλλον, που δεν μπόρεσαν να εισέλθουν στη Σχολή του Μινσκ ή που αρχίζουν να κάνουν οποιαδήποτε άλλη δοκιμαστική εργασία. Όπως μπορείτε να δείτε, είναι πολύ πιθανό να το κάνετε. Απλά πρέπει να πιστέψετε στον εαυτό σας και να ακούσετε όλες τις συμβουλές από τους συγγραφείς.
Πηγή: www.habr.com