Giusto avvertimento! Questa non è una spiegazione rapida, diretta e guidata da esperti su come impostare queste tecnologie. Anche se, alla fine, riusciamo a far funzionare tutto con successo. Si tratta di documentare l'esperienza del mondo reale di fare questo tipo di lavoro. Alcune cose funzionano facilmente, altre no. A volte è colpa mia. A volte i documenti non sono chiari. A volte sono avvenuti cambiamenti sotto i nostri piedi. Dobbiamo combattere in tutto questo.
Abbiamo un piccolo piano qui. Quello che vogliamo fare è avviare un progetto locale che utilizzi:
- React: Diciamo che stiamo costruendo una SPA e desideriamo fortemente lavorare con un modello di componenti.
- ReactDOM - Stiamo costruendo per il web.
- Webpack: Vogliamo un server di sviluppo, un ricaricamento a caldo dei moduli e un modo per raggruppare le nostre dipendenze in modo degno di produzione.
- Babel: Potremmo non aver bisogno di molta futura compilazione di JavaScript, ma abbiamo bisogno di JSX, e Babel è ciò che lo compila.
- Moduli CSS: Vogliamo scrivere alcuni CSS specifici per componenti isolati e questo è un bel modo per farlo in cui i nostri stili rimangono nei fogli di stile.
Fortunatamente, poiché stavo progettando di fare questo video, ho trovato l'articolo "Come creare un'app React da zero utilizzando Webpack 4" di Linh Nguyen My. 12.5K applausi su Medium! Wow! Ho aggiunto anche una serie di applausi, perché sembra essere l'unico tutorial là fuori che copre effettivamente questa combinazione super popolare di amici in un modo accessibile che funziona davvero.
Questo non vuol dire che tutto vada facilmente e senza intoppi! Mi imbatto in un sacco di piccoli problemi lungo la strada. Alcune sono cose che diteggiano. Alcuni di questi sono errori misteriosi che compaiono quando eseguiamo comandi che capisco a malapena. Alcuni di essi sembrano mancare di documentazione sulle funzionalità. Tuttavia, alla fine abbiamo risolto tutto e abbiamo un progetto funzionante!