Δίκαιη προειδοποίηση! Αυτό δεν είναι μια γρήγορη, απλή, καθοδηγούμενη από τους ειδικούς τρόπους ρύθμισης αυτών των τεχνολογιών. Παρόλο που, μέχρι το τέλος, τα καταφέρουμε όλα. Πρόκειται για την τεκμηρίωση της πραγματικής εμπειρίας από την πραγματοποίηση αυτού του είδους της εργασίας. Μερικά πράγματα λειτουργούν εύκολα, κάποια όχι. Μερικές φορές είναι δικό μου λάθος. Μερικές φορές τα έγγραφα είναι ασαφή. Μερικές φορές έχουν γίνει αλλαγές κάτω από τα πόδια μας. Πρέπει να πολεμήσουμε όλα αυτά.
Έχουμε ένα μικρό σχέδιο εδώ. Αυτό που θέλουμε να κάνουμε είναι να δημιουργήσουμε ένα τοπικό έργο που χρησιμοποιεί:
- Αντιδράστε: Ας πούμε ότι χτίζουμε ένα SPA και επιθυμούμε έντονα να συνεργαστούμε με ένα μοντέλο συστατικών.
- ReactDOM - Χτίζουμε για τον Ιστό.
- Webpack: Θέλουμε έναν διακομιστή dev, μια επαναφόρτωση της λειτουργικής μονάδας και έναν τρόπο ομαδοποίησης των εξαρτήσεών μας με τρόπο παραγωγής.
- Babel: Ίσως δεν χρειαζόμαστε πολύ μελλοντική μεταγλώττιση JavaScript, αλλά χρειαζόμαστε το JSX και το Babel είναι αυτό που το συντάσσει.
- Ενότητες CSS: Θέλουμε να γράψουμε ένα απομονωμένο CSS για συγκεκριμένα συστατικά και αυτός είναι ένας καλός τρόπος να το κάνουμε όπου τα στυλ μας παραμένουν σε φύλλα στυλ.
Ευτυχώς, καθώς σχεδίαζα να κάνω αυτό το βίντεο, βρήκα το άρθρο «Πώς να δημιουργήσω μια εφαρμογή React από το μηδέν χρησιμοποιώντας το Webpack 4» του Linh Nguyen My. 12,5K χειροκροτήματα στο Medium! Ουάου! Πρόσθεσα και πολλά χειροκρότημα σε αυτό, επειδή φαίνεται να είναι το ένα σεμινάριο εκεί έξω που καλύπτει πραγματικά αυτόν τον εξαιρετικά δημοφιλή συνδυασμό φίλων με έναν προσιτό τρόπο που λειτουργεί πραγματικά.
Αυτό δεν σημαίνει ότι όλα πάνε εύκολα και ομαλά! Αντιμετωπίζω πολλά μικρά προβλήματα στην πορεία. Μερικά από αυτά είναι με λίγα πράγματα. Μερικά από αυτά είναι μυστηριώδη σφάλματα που εμφανίζονται όταν εκτελούμε εντολές που μόλις καταλαβαίνω. Κάποια από αυτά φαίνεται να λείπουν τεκμηρίωση σχετικά με τις δυνατότητες. Παρ 'όλα αυτά, όλα τακτοποιούνται στο τέλος και έχουμε ένα έργο εργασίας!