Ανάπτυξη Ιστού το 2020: Τι εργαλεία κωδικοποίησης πρέπει να μάθετε

Σήμερα ένας από τους αγαπημένους μου δασκάλους, ο Brad Traversy, δημοσίευσε μια επισκόπηση του τι σας προτείνει να μάθετε να γίνετε προγραμματιστής Ιστού το 2020.

Ο Μπραντ περνάει πολύ από τη διαφημιστική εκστρατεία που ακούτε στα κοινωνικά μέσα. Οι συμβουλές του είναι πρακτικές και ρεαλιστικές. Και συμφωνώ μαζί του για σχεδόν όλα όσα σας προτείνει να μάθετε.

Το κύριο πράγμα που τονίζει ο Μπραντ - και αυτό που πάντα τονίζω - δεν αισθάνεστε φοβισμένοι ή αφήστε τον εαυτό σας να κατακλυστεί.

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

Παρακάτω συνοψίζω τις βασικές πληροφορίες του Μπραντ για την εξυπηρέτησή σας. Ωστόσο, σας ενθαρρύνω να παρακολουθήσετε το πλήρες βίντεό του, το οποίο έχω ενσωματώσει παρακάτω. Προσθέτει πολλές λεπτομέρειες πέρα ​​από αυτό που μεταφέρουν αυτές οι σημειώσεις. Είναι ένα ρολόι 73 λεπτών.

Ανάπτυξη Ιστού το 2020: Μια επισκόπηση

Ο κύριος στόχος του βίντεο είναι να σας εξοικειώσει με μερικά από τα πιο βασικά εργαλεία ανάπτυξης ιστού που είναι διαθέσιμα στους προγραμματιστές ιστού.

"Δεν προσπαθώ να σας κατακλύσω με τεχνολογίες. Αυτές είναι μόνο επιλογές που έχετε ... Υπάρχουν πολλές τεχνολογίες εκεί έξω. Όταν ακούτε κάτι όπως το Nuxt ή το Gatsby θέλω να ξέρετε τι είναι. Και τότε μπορείτε να επιλέξετε αν θέλετε να το μάθετε ή όχι. "

Ο Μπραντ ξεκινά ενθαρρύνοντας τους ανθρώπους να ρωτήσουν πρώτα τι θέλουν να κάνουν. Θέλετε να εργαστείτε σε μια εταιρεία προϊόντων; Ή εργάζεστε ως σύμβουλος; Θέλετε να είστε ανεξάρτητοι; Ή δημιουργήστε ένα δικό σας προϊόν;

Πολλές από τις συμβουλές του για το τι πρέπει να μάθετε πηγάζει από τους στόχους σας. Και διαμορφώνει πολλές από τις προτάσεις εργαλείων υπό το φως αυτό.

Ως σημείο εκκίνησης, συνιστά να μάθετε αυτό που αποκαλεί "Οι αναγκαιότητες".

Ένα αντίθετο-διαισθητικό πράγμα που επισημαίνει: δεν χρειάζεστε έναν φανταχτερό υπολογιστή για ανάπτυξη ιστοσελίδων. "Δεν είναι σαν την ανάπτυξη μηχανών παιχνιδιών ή κάτι τέτοιο, οπότε μπορείτε να χρησιμοποιήσετε φορητό υπολογιστή ή επιτραπέζιο υπολογιστή μεσαίας κατηγορίας ή ακόμη και σε ορισμένες περιπτώσεις έναν υπολογιστή χαμηλού επιπέδου."

Χρησιμοποιεί MacOS, Windows 10 και Linux για διακομιστές cloud και ακόμη και για ορισμένους από τους διακομιστές πολυμέσων του.

Είναι μεγάλος θαυμαστής του κώδικα VS για τον συντάκτη του και χρησιμοποιεί το Chrome και τα ενσωματωμένα του DevTools για εντοπισμό σφαλμάτων που βασίζεται στο πρόγραμμα περιήγησης. Τούτου λεχθέντος, πιστεύει ότι ο Firefox έχει προχωρήσει πολύ και είναι μια βιώσιμη εναλλακτική λύση.

Συνιστά να ξεκινήσετε με τυπικό HTML και CSS και να μάθετε νεότερα εργαλεία CSS όπως το Flexbox και το Grid.

Λέει ότι η εκμάθηση σχεδιασμού ιστοσελίδων που ανταποκρίνεται το 2020 πρέπει να είναι δεδομένη. "Κάθε σοβαρό έργο που δημιουργείτε θα πρέπει να φαίνεται καλό και να είναι εντελώς χρησιμοποιήσιμο σε όλες τις συσκευές."

Αντί να βασίζεστε σε πλαίσια CSS όπως το Bootstrap, σας προτείνει να εξασκηθείτε στη δημιουργία των δικών σας αρθρωτών στοιχείων CSS τα οποία στη συνέχεια μπορείτε να χρησιμοποιήσετε ξανά σε όλο το έργο σας.

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

Αναφέρει συγκεκριμένα το Tailwind, το οποίο δεν είχα ξαναδεί. Το Tailwind είναι λίγο διαφορετικό από άλλα πλαίσια CSS. Επικεντρώνεται σε "τάξεις χρησιμότητας" που μπορείτε να συνδυάσετε για να ολοκληρώσετε αυτό που θέλετε με το σχεδιασμό.

Δεν αποτελεί έκπληξη το γεγονός ότι ο Μπραντ συνιστά να γίνει πολύ καλός με το JavaScript.

Μαθαίνοντας με πρακτικό ρυθμό

Σε όλο τον οδηγό του Μπραντ, τονίζει επανειλημμένα την ανάγκη πρακτικότητας.

Ναι - υπάρχουν βέλτιστες πρακτικές για τα πάντα. Αλλά σε πολλές περιπτώσεις, υπάρχει ένας αρκετά καλός τρόπος που θα σας βοηθήσει να κινηθείτε γρηγορότερα και να κάνετε περισσότερα, χωρίς να μπείτε στα εργαλεία.

Ένα από τα πιο ενδιαφέροντα (και ίσως αιρετικά) πράγματα που λέει:

"Δεν χρειάζεται να μάθετε DevOps και AWS και όλα αυτά τα πράγματα για έναν μικρό ιστότοπο. Ένας ιστότοπος φιλοξενίας ή ένας διαχειριζόμενος ιστότοπος φιλοξενίας όπως το InMotion ή το Hostgator είναι εντάξει. Σας επιτρέπει να κάνετε [ανάπτυξη] απευθείας στο πρόγραμμα περιήγησης. Δεν χρειάζεται να υπερβολικά περίπλοκα πράγματα. "

Υποστηρίζει ότι ακόμη και το 2020, πρέπει να ειπωθεί κάτι για τη χρήση οικείων εργαλείων.

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

"Οι Χίπστερς θα πουν ότι πρέπει σίγουρα να χρησιμοποιήσετε ένα πλαίσιο διεπαφής. Δεν νομίζω ότι είναι αλήθεια. Εάν θέλετε να αποδώσετε πρότυπα στο διακομιστή χωρίς να χρησιμοποιήσετε ένα πλαίσιο διεπαφής, νομίζω ότι είναι απολύτως εντάξει, αλλά υπάρχουν πολλά πολλά θέσεις εργασίας που αναζητούν κάτι όπως το React ή το Vue. "

Όμως, όταν είστε έτοιμοι να αντιμετωπίσετε τα πλαίσια front end, σας προτείνει να εξερευνήσετε το React, το Vue και το Angular. "Δοκιμάστε και τα τρία και μάθετε ποιο σας αρέσει περισσότερο."

Δίνει επίσης ένα νεύμα στο Svelte - το οποίο δεν είναι πλαίσιο, αλλά μάλλον μεταγλωττιστή Αλλά λέει ότι είναι πιθανώς πολύ νέο για να δοκιμάσετε το 2020.

Και συζητά την αυξανόμενη δημοτικότητα του Server Side Rendering. Η δρομολόγηση βάσει συστήματος αρχείων σημαίνει ότι δεν χρειάζεται να δημιουργήσετε ένα περίπλοκο αρχείο δρομολόγησης. Αντ 'αυτού, μπορείτε απλά να βάλετε τα αρχεία στον κατάλογο στον οποίο θέλετε να βρίσκονται.

Τα δύο δημοφιλή εργαλεία Side Side Rendering είναι Next.js (για React) και Nuxt.js (η επιλογή Vue).

Μια άλλη αναδυόμενη τάση είναι το Static Site Renders, το οποίο λέει ότι δεν χρειάζεται να μάθετε, αλλά πρέπει να γνωρίζετε. Για παράδειγμα, οι ιστότοποι του Gatsby είναι εξαιρετικά γρήγοροι και δεν χρειάζονται διακομιστή.

Εργαλεία ανάπτυξης Back End

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

Για τα πλαίσια ανάπτυξης από πλευράς διακομιστή, προτείνει την εκμάθηση Express καθώς είναι το πιο δημοφιλές και "σας δίνει μεγάλη ελευθερία να δημιουργείτε πράγματα όπως θέλετε με τον δικό σας τρόπο."

Χρησιμοποιεί επίσης το Python για ορισμένα έργα και το προτείνει επίσης.

"Η Python έχει δύο φοβερά πλαίσια. Το Django είναι ένα μεγάλο, πλήρες χαρακτηριστικό πλαίσιο, όπου καθώς το Flask είναι πιο μινιμαλιστικό. Σας δίνει ό, τι χρειάζεστε, αλλά παίρνετε τις υπόλοιπες αποφάσεις. Ειλικρινά δεν μπορώ να διαλέξω ένα από τα δύο, εγώ αγαπήστε και τους δύο και χρησιμοποιήστε τα για διαφορετικά πράγματα. "

Και έρχεται γρήγορα στην άμυνα της PHP:

"Πολλοί άνθρωποι δίνουν χάλια στην PHP και είναι ατυχές γιατί η PHP μπορεί να είναι μια υπέροχη γλώσσα. Είναι πρακτικό και είναι απλό να αναπτυχθεί σχεδόν οπουδήποτε. Η PHP είναι ιδανική για ελεύθερους επαγγελματίες που πρέπει να βγάλουν πράγματα γρήγορα. Εάν σχεδιάζετε δουλεύοντας για μια μεγάλη εταιρεία, η PHP μπορεί να μην είναι η καλύτερη επιλογή, αλλά αν είστε ελεύθερος επαγγελματίας και δημιουργείτε προσωπικά έργα, η PHP μπορεί να είναι εξαιρετική επιλογή. Έχει γίνει δροσερό το bash. Η PHP ήταν η πρώτη γλώσσα που έμαθα και μου αρέσει ακόμα αυτό ... Αν κοιτάξετε τον κωδικό Laravel είναι πολύ κομψό. "

Ο Μπραντ κάνει επίσης μια γρήγορη αναδρομή σε βάσεις δεδομένων και συνιστά πολυετές αγαπημένο PostgreSQL.

Άλλα εργαλεία που είναι πιθανότατα εδώ για να μείνετε

Το GraphQL είναι μια εναλλακτική λύση για το REST για API. Υπάρχουν πολλά μαθήματα που καλύπτουν το GraphQL τόσο στο κανάλι του Brad όσο και στο κανάλι του FreeCodeCamp. Αλλά λέει, "Το GraphQL δεν είναι κάτι που πρέπει να μάθετε αυτές τις μέρες, αλλά είναι αρκετά μεγάλο που νομίζω ότι είναι εδώ για να μείνετε. Είναι κάτι περισσότερο από μια τάση."

Ο Μπραντ μιλά επίσης για Συστήματα Διαχείρισης Περιεχομένου (CMS) και πώς εξελίσσονται σε νέες "χωρίς κεφαλή" επιλογές, όπου τις χρησιμοποιείτε μόνο ως back-end και κωδικοποιείτε το δικό σας front end

"Τα CMS είναι πολύ βολικά για ελεύθερους επαγγελματίες που έχουν πελάτες που θέλουν να μπορούν να συνδεθούν και να δημιουργήσουν αναρτήσεις ιστολογίου και τέτοια πράγματα. Πολλοί άνθρωποι χτυπούν το WordPress, αλλά υπάρχει ένα τεράστιο ποσοστό ιστότοπων στο Διαδίκτυο που διαχειρίζονται το WordPress και εξακολουθεί να είναι πολύ δημοφιλές. "

Για διακομιστές Ιστού προτιμά το NGINX από τον Apache επειδή "φαίνεται να είναι λιγότερο περίπλοκο." Χρησιμοποιούμε το NGINX εκτενώς στο freeCodeCamp και τείνω να συμφωνήσω.

Ο Μπραντ εξηγεί επίσης πώς λειτουργεί η εικονικοποίηση και μιλάει για το πώς μπορεί να απλοποιήσει πιο περίπλοκα έργα τυποποιώντας το περιβάλλον σε πολλούς υπολογιστές. Αλλά προειδοποιεί να μην προσπαθήσει να εικονικοποιήσει τα πάντα:

"Το Docker είναι πραγματικά καλό για ομάδες. Αυτό που δεν μου αρέσει είναι όταν οι άνθρωποι λένε ότι πρέπει πάντα να χρησιμοποιείτε το Docker. Είναι απλώς προτίμηση. Εάν θέλετε απλώς να εκτελέσετε έναν τοπικό διακομιστή LAMP, δεν υπάρχει τίποτα λάθος με αυτό. Μην αισθάνεστε πίεση να μάθεις κάτι σαν τον Ντόκερ. "

Και προσθέτει, για να τονίσω κάτι που προσωπικά δεν μπορώ να τονίσω αρκετά: "Ξέρω ότι πολλοί τύποι nerdy θέλουν απλώς να περιπλέκουν τα πράγματα και το μισώ αυτό. Ακριβώς επειδή απαριθμώ όλα αυτά δεν σημαίνει ότι το πιέζω εσείς."

Είναι επίσης γρήγορος να επισημάνει ότι οι περισσότερες μεγάλες εταιρείες έχουν αφιερώσει ομάδες DevOps (ονομάζονται επίσης "Site Reliability Engineers") που μπορούν να κάνουν πολλά από αυτά για εσάς.

Ωραίο να έχετε δεξιότητες που μπορείτε να μάθετε ως ειδικότητες

Εάν θέλετε να δοκιμάσετε τα χέρια σας στην ανάπτυξη εφαρμογών για κινητά, ο Brad συνιστά ιδιαίτερα το πλαίσιο Flutter. Χρησιμοποιεί το Dart, το οποίο είναι μια πιο σκοτεινή γλώσσα. Περιγράφει το Dart ως κάπου μεταξύ Java και JavaScript και λέει αν γνωρίζετε κάποια από αυτές τις γλώσσες θα πρέπει να μπορείτε να το επιλέξετε.

Η δεύτερη επιλογή του για ανάπτυξη εφαρμογών για κινητά είναι το React Native, το οποίο είναι εύκολο να το παραλάβετε εάν γνωρίζετε ήδη το React.

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

Στη συνέχεια, αγγίζει το Electron, το οποίο σας επιτρέπει να δημιουργήσετε εφαρμογές επιφάνειας εργασίας χρησιμοποιώντας JavaScript. Αρχικά ήταν δύσπιστος, αλλά λέει ότι μερικές από τις αγαπημένες του εφαρμογές για επιτραπέζιους υπολογιστές - όπως το VS Code και το Discord - είναι τώρα κατασκευασμένες με χρήση Electron.

Αναφέρει το JAMstack (JavaScript, API και Markup) και την αρχιτεκτονική χωρίς διακομιστές. Αυτά είναι πιο προχωρημένα θέματα στα οποία το κανάλι του και το κανάλι YouTube του FreeCodeCamp έχουν επίσης εκπαιδευτικά βίντεο.

Και μετά φτάνει στις μεγάλες τάσεις για το 2020.

Μηχανική εκμάθηση και συνέλευση Ιστού

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

Και ναι, μπορείτε επίσης να κάνετε μηχανική εκμάθηση σε JavaScript.

"Η Python είναι ο βασιλιάς για τη Μηχανική Εκμάθηση. Αλλά ακόμη και με JavaScript έχετε το TensorFlow.js, έχετε το Brain.js για να δημιουργήσετε νευρωνικά δίκτυα και να κάνετε κάποια πραγματικά ωραία πράγματα."

Είναι ξεκάθαρο από τον τρόπο που μιλάει για το Web Assembly ότι είναι πολύ ενθουσιασμένος για αυτό.

"Η Συνέλευση Ιστού βρίσκεται ακόμη στα αρχικά της στάδια, αλλά νομίζω ότι θα το δούμε περισσότερα φέτος. Παραδοσιακά χρησιμοποιούμε JavaScript στην ιστοσελίδα για να χειριστούμε το DOM και να εκτελέσουμε υπολογισμούς. Η JavaScript έχει περιορισμούς ως προς την ταχύτητα. Μια γλώσσα όπως το C ή το C ++ είναι πολύ πιο γρήγορο από το JavaScript. Επομένως, το Web Assembly είναι ένας αποτελεσματικός κώδικας byte χαμηλού επιπέδου που μπορεί να εκτελεστεί από ένα πρόγραμμα περιήγησης και είναι εξαιρετικά γρήγορος. Μπορεί να δημιουργηθεί από γλώσσες όπως C, C ++ και Rust. "

Το Rust είναι μια από τις γλώσσες που μπορείτε να χρησιμοποιήσετε με το WebAssembly (εκτός από τα C και C ++). Είναι πολύ πιο εύκολο να μάθετε και να χρησιμοποιήσετε από τα C και C ++.

Αλλά είναι σημαντικό να σημειωθεί ότι το WebAssembly δεν σας συγχωρεί από το να πρέπει να μάθετε JavaScript.

"Μπορείτε σχεδόν να σκεφτείτε τη JavaScript ως αφεντικό και μπορεί να πει στη Συνέλευση Ιστού τι να κάνει. Επομένως, μας επιτρέπει να χρησιμοποιούμε πολύ γρήγορες γλώσσες χαμηλού επιπέδου όπως το C ++ στις εφαρμογές ιστού μας, και αυτό μας δίνει πολύ περισσότερες δυνατότητες - όπως βιντεοπαιχνίδια επόμενου επιπέδου και εργαλεία επεξεργασίας βίντεο απευθείας στο πρόγραμμα περιήγησης - πράγματα που είναι αδιανόητα μόνο με JavaScript. "

Κλείνοντας λέει, "Όσο περισσότερο μαθαίνετε, τόσο πιο εύκολο είναι να μάθετε περισσότερα και να ταιριάξετε όλες αυτές τις τεχνολογίες μαζί. Προσπαθήστε να μην κατακλύζεστε. Κάντε το ένα βήμα τη φορά και κάντε κάποια έρευνα και καταλάβετε τι εσείς θέλω να κάνω."

Και πάλι, θέλω να ευχαριστήσω τον Brad Traversy για τη δημιουργία αυτού του περιεκτικού βίντεο.

Οι άνθρωποι με ρωτούν όλη την ώρα "τι πρέπει να μάθω αν θέλω να γίνω προγραμματιστής ιστού;" Και η απάντησή μου είναι "απλώς χρησιμοποιήστε το freeCodeCamp ως το βασικό σας πρόγραμμα σπουδών και προχωρήστε σε άλλους πόρους μάθησης καθώς πηγαίνετε"

Και χαίρομαι που λέω ότι το κανάλι του Brad's Traversy Media YouTube είναι ένας από αυτούς τους πρόσθετους πόρους που προτείνω ιδιαίτερα.