Προγραμματιστής Fullstack JavaScript - μάθημα 59.200 RUB. από το Πανεπιστήμιο Innopolis, εκπαίδευση 4 μηνών

instagram viewer

ΕΓΩ. Εισαγωγικός. Εργαλειοθήκη, git, εγκατάσταση έργου

Στο πρώτο μπλοκ, θα παρέχουμε σε όλους τους συμμετέχοντες στο μάθημα ένα σύνολο εργαλείων που είναι απαραίτητα για την πρόοδο στα θέματα. Θα πραγματοποιηθούν μεμονωμένες διαβουλεύσεις εγκατάστασης, κατά τις οποίες θα καθορίσουμε μεμονωμένους στόχους για το μάθημα, με βάση την προσωπική σας εμπειρία ανάπτυξης. Ως αποτέλεσμα αυτού του μπλοκ, θα μάθετε πώς να διαμορφώνετε ανεξάρτητα τη συναρμολόγηση μιας εφαρμογής SPA με οποιονδήποτε προεπεξεργαστή CSS χρησιμοποιώντας το webpack. Επίσης, αποκτήστε μια βασική κατανόηση της γλώσσας Typescript και των χαρακτηριστικών της διαμόρφωσης και χρήσης της.

— Στο πρώτο μάθημα θα σας δείξουμε το απαραίτητο σύνολο εργαλείων, πώς να τα εγκαταστήσετε και να τα διαμορφώσετε. Θα μάθετε πώς να ρυθμίζετε μια έκδοση έργου React από την αρχή.

— Εξοικειωθείτε με τα βασικά της γλώσσας Typescript και τις διαφορές της από την JavaScript.

II. Αντιδρώ

Κατά τη διάρκεια του δεύτερου μπλοκ, θα σχηματιστούν ομάδες, οι διαβουλεύσεις θα μεταβούν σε συναντήσεις ομάδων. Σε τέτοιες συναντήσεις, θα αποφασίσουμε για το έργο, θα σχηματίσουμε ένα σύνολο λειτουργιών, που θα είναι ο στόχος μας για το μάθημα. Θα αναπτύξετε διατάξεις και μέχρι το τέλος του μπλοκ θα έχετε απλώσει όλες τις σελίδες του ομαδικού έργου στο React.

— Ας εξοικειωθούμε με την ιστορία της εμφάνισης πλαισίων ιστού, ας συζητήσουμε τα πλεονεκτήματα και τα μειονεκτήματα του React και ας αρχίσουμε να αναπτύσσουμε τα πρώτα στοιχεία στο React.

— Ας μελετήσουμε τις βέλτιστες πρακτικές για την οργάνωση της δομής μιας εφαρμογής React. Ας βουτήξουμε στις λεπτομέρειες της απόδοσης στοιχείων React. Ας αρχίσουμε να χρησιμοποιούμε τη σύγχρονη προσέγγιση CSS-IN-JS για το στυλ των στοιχείων React που βασίζονται σε στοιχεία στυλ.

— Ας μάθουμε πώς να εργαζόμαστε σωστά με τα κύρια στοιχεία των στοιχείων React - Props και State, τα οποία θα σας βοηθήσουν να προσθέσετε ευελιξία στα στοιχεία. Ας βρούμε τη σωστή μέθοδο αλληλεπίδρασης με στοιχεία DOM από στοιχεία React.

— Ας συνεχίσουμε να μελετάμε το React API, να δούμε τρόπους αλληλεπίδρασης με θυγατρικά στοιχεία και να μάθουμε πώς να αποφύγουμε το πρόβλημα των ατελείωτων στηρίξεων με χρήση του περιβάλλοντος. Ας ρίξουμε μια ματιά σε μια εναλλακτική προσέγγιση για την επέκταση των δυνατοτήτων ενός στοιχείου React.

— Ας αναλύσουμε τον κύκλο ζωής ενός στοιχείου, ας καταλάβουμε πώς να το εφαρμόσουμε, κάτι που θα μας επιτρέψει να εμπλουτίσουμε τα στοιχεία με νέους τύπους λογικής.

— Ας καταλάβουμε πώς το React μπόρεσε να απομακρυνθεί εντελώς από τα στοιχεία κλάσης προς λειτουργικά χρησιμοποιώντας το νέο μοτίβο Hooks. Ας εξοικειωθούμε με τα βασικά hook του React.

— Θα μάθουμε ακριβώς πώς λειτουργεί η εναλλαγή μεταξύ σελίδων χωρίς επαναφόρτωση και θα εφαρμόσουμε επίσης το React-Router στην εργασία.

— Ας μάθουμε πώς να αναπτύσσουμε πολύγλωσσες εφαρμογές React.

— Ας δούμε τρόπους για να εισαγάγουμε ευελιξία στο στυλ διεπαφής, στην εργασία με θέματα (για παράδειγμα, ανοιχτό/σκοτεινό), στην εργασία με εικονίδια και κινούμενα σχέδια χρησιμοποιώντας το lotty ως παράδειγμα.

III. Nodejs

Σε αυτό το βήμα, θα εφαρμόσετε τον διακομιστή σας στο Node.js χρησιμοποιώντας τη βιβλιοθήκη Express.js. Εφαρμογή ενός API για ένα ομαδικό έργο. Μάθετε να εργάζεστε στο πρόγραμμα ταχυδρόμος. Μάθετε τα βασικά της χρήσης μιας εικόνας docker χρησιμοποιώντας το παράδειγμα εργασίας με τη βάση δεδομένων Mongodb.

— Εισαγωγή στο Node.js, το ιστορικό του και τα βασικά στοιχεία του διαχειριστή πακέτων.

— Μάθετε πώς λειτουργεί το Node.js με αρχεία, πώς δημιουργούνται και δημοσιεύονται οι λειτουργικές μονάδες και εξοικειωθείτε με τις δυνατότητες αυτής της διαδικασίας.

— Μάθετε να δημιουργείτε έναν διακομιστή στο Node.js χρησιμοποιώντας το πλαίσιο Express.js.

— Συνέχιση της μελέτης των δυνατοτήτων του διακομιστή στο Express.js.

IV. Redux

Αφού ολοκληρώσετε αυτό το μπλοκ, θα καταλάβετε πώς συμβαίνει η αλληλεπίδραση με το backend API σε μια σύγχρονη εφαρμογή React. Μάθετε να αναπτύσσετε και να διαχειρίζεστε stub για τοπική ανάπτυξη, μάθετε πώς να δημιουργείτε μια διαμορφώσιμη εφαρμογή microfrontend για να λειτουργεί με έναν πραγματικό διακομιστή.

— Για να κατανοήσουμε σε βάθος πώς λειτουργεί ο διαχειριστής κατάστασης Redux, ας γράψουμε τη δική μας έκδοση και ας κατανοήσουμε τα βασικά της χρήσης του Redux.

— Ας δούμε στην πράξη πώς και γιατί χρησιμοποιείται το Redux στην κλασική του μορφή.

— Κατακτήστε τη χρήση και κατανοήστε την έννοια των επιλογέων με και χωρίς άγκιστρα.

— Με βάση προηγούμενες γνώσεις, ας εξετάσουμε μια πιο σύγχρονη χρήση του Redux χάρη στη βιβλιοθήκη @reduxjs/toolkit.

— Ας καταλάβουμε τις περιπλοκές της εργασίας με τον διακομιστή και τη θέση του Redux σε αυτή τη διαδικασία.

V. Αστείο

Σε αυτό το μπλοκ, θα διερευνήσουμε πώς και γιατί να δοκιμάσουμε μια εφαρμογή Ιστού. Θα μάθετε πώς να δοκιμάζετε την αίτησή σας και να αυξάνετε την κάλυψη δοκιμής κώδικα στο βιομηχανικό πρότυπο του 80%. Θα μάθετε τις αρχές της δοκιμής εφαρμογών χρησιμοποιώντας τη βιβλιοθήκη Jest ως παράδειγμα.

— Ας μιλήσουμε για το γιατί πρέπει να γράψετε καθόλου τεστ και πώς να το κάνετε γρήγορα και αποτελεσματικά.

— Μάστερ ρυθμίζοντας το πλαίσιο δοκιμής Jest από την αρχή.

— Συνέχεια του προηγούμενου θέματος με έμφαση στο Unit testing.

— Θα δείτε πώς μπορείτε να προσθέσετε δοκιμές διεπαφής χρήστη στο έργο.

VI. Εφαρμογή Ενιαίας Σελίδας

Σε αυτό το μπλοκ, θα εξερευνήσουμε τεχνολογίες που θα χρησιμοποιηθούν σε όλες τις σύγχρονες εφαρμογές web και θα γίνουν διαθέσιμες μετά την κατάργηση της υποστήριξης από τον Internet Explorer. Αυτό συνέβη στις 15 Ιουνίου 2022.

— Ας εξοικειωθούμε με την ιδέα μιας μονοσέλιδης εφαρμογής.

— Ας μάθουμε πώς να γράψετε τη δική σας βιβλιοθήκη στοιχείων.

— Ας κατακτήσουμε το multithreading στο Node.js.

— Ας γράψουμε μια συνομιλία σε μια υποδοχή web. Θα το χακάρετε με τα χέρια σας στην τάξη και επίσης θα μάθετε πώς να αμύνεστε από τέτοιες επιθέσεις.

— Ας δούμε τη δημιουργία της δικής σας συνομιλίας βίντεο για δύο.

— Ας εξοικειωθούμε με τα βασικά της εγκατάστασης διακομιστή στο Nginx και της εξισορρόπησης. Θα μάθουμε επίσης πώς να συνδέουμε τις μηχανές αναζήτησης με την εφαρμογή SPA μας.

Υπεράσπιση του τελικού έργου