การติดตั้งและการเตรียมแอปพลิเคชัน React

ในบทเรียนนี้ เราจะเริ่มจากการติดตั้งและเตรียม แอปพลิเคชัน React เนื่องจากต่อไปเราจะ ใช้มันร่วมกับ Redux มีวิธีที่เร็วกว่า ในการสร้างเทมเพลตแอปพลิเคชัน React พร้อม Redux (ซึ่งก็ไม่เสมอไปว่า จะง่าย โดยเฉพาะสำหรับผู้เริ่มต้น) ที่ระบุไว้ ในเอกสารทางการ แต่เราจะเริ่มจากศูนย์

เริ่มแรก สร้างแอปพลิเคชัน React my-app โดยใช้ Vite (เป็นตัวแทนที่ทันสมัยของ Webpack) เพื่อทำสิ่งนี้ เปิด เทอร์มินัล และป้อนคำสั่งต่อไปนี้ (ในตัวเลือกที่เสนอ ถ้ามี ให้เลือก React จากนั้น JavaScript):

terminalnpm create vite@latest my-app -- --template react
cd my-app
npm install

เรียกใช้แอปพลิเคชันที่สร้างขึ้น:

terminalnpm run dev

เปิดลิงก์ที่เสนอในเบราว์เซอร์ http://localhost:5173/ และจะเห็น หน้าจอเริ่มต้นที่คุ้นเคย ทุกอย่างทำงานได้

ตอนนี้ ลบสิ่งที่ไม่จำเป็นออก ล้างโฟลเดอร์ public ในโฟลเดอร์ src เก็บไว้เฉพาะ main.jsx, index.css และ App.jsx (ใน index.css และ App.jsx ลบเนื้อหาทั้งหมดออก)

ในไฟล์ index.html แทนที่ข้อความ ไตเติลด้วย:

index.html<title>React Redux App</title>