Amaran yang adil! Ini bukan jalan cepat, mudah, berasaskan pakar mengenai cara menyiapkan teknologi ini. Walaupun pada akhirnya, kita berjaya semuanya berjalan lancar. Ini adalah untuk mendokumentasikan pengalaman dunia nyata dalam melakukan pekerjaan seperti ini. Beberapa perkara berfungsi dengan mudah, ada yang tidak. Kadang-kadang itu salah saya. Kadang-kadang dokumen tidak jelas. Kadang-kadang perubahan telah berlaku di bawah kaki kita. Kita harus berjuang melalui semua itu.
Kami ada sedikit rancangan di sini. Apa yang ingin kita lakukan ialah membuat projek tempatan yang menggunakan:
- React: Katakan kita membina SPA dan sangat berkeinginan untuk bekerja dengan model komponen.
- ReactDOM - Kami membina laman web.
- Webpack: Kami mahukan pelayan dev, muat semula modul panas, dan cara untuk menggabungkan pergantungan kami dengan cara yang sesuai untuk pengeluaran.
- Babel: Kami mungkin tidak memerlukan banyak penyusunan JavaScript masa depan, tetapi kami memerlukan JSX, dan Babel adalah yang menyusunnya.
- Modul CSS: Kami ingin menulis beberapa CSS khusus komponen yang terpencil dan ini adalah cara yang baik untuk melakukannya di mana gaya kami tetap berada dalam helaian gaya.
Untungnya, ketika saya berencana untuk membuat video ini, saya menjumpai artikel "Cara Membuat aplikasi React dari awal menggunakan Webpack 4" oleh Linh Nguyen My. 12.5K bertepuk tangan di Medium! Wah! Saya menambahkan banyak tepukan juga, kerana sepertinya ini adalah satu tutorial di luar sana yang sebenarnya merangkumi gabungan rakan-rakan yang sangat popular ini dengan cara yang mudah didekati yang sebenarnya berfungsi.
Itu belum tentu semuanya berjalan dengan mudah dan lancar! Saya menghadapi banyak masalah kecil sepanjang perjalanan. Sebahagian daripadanya adalah saya yang gemuk. Sebahagiannya adalah kesalahan misteri yang muncul ketika kita menjalankan perintah yang hampir tidak saya fahami. Sebilangannya nampaknya tidak mempunyai dokumentasi mengenai ciri. Walaupun begitu, kita dapat menyelesaikannya pada akhirnya dan mempunyai projek yang berfungsi!