ตัวอย่างโปรเจ็ค React จากคลิปสอน Ep.2-20 ของ Zinglecode
https://www.youtube.com/watch?v=dxm-Mtd-LPs&list=PL_xSQKvnccpn-C2fZNJtCykO24yqFWkDn&index=2
เนื่องจาก React Router ที่ใช้ใน Github Repo อันนี้เป็น v5 (ตัวเก่า) ดังนั้นถ้าใครอยากดูตัวอย่างโค้ดของ React Router v6 (ตัวปัจจุบัน) กรุณาเปิดดูได้จากลิ้งค์นี้
https://github.com/potchangelo/react-just-react-router-v6
-
ติดตั้ง Node.js ลงเครื่องให้เรียบร้อยก่อน (ใช้ Version 14, 16, หรือ 18 ก็ได้)
-
ดาวน์โหลดโปรเจ็คนี้ลงเครื่อง (เลือกจาก Github branch ที่ต้องการได้)
-
เปิดโฟลเดอร์โปรเจ็คใน VSCode
-
เปิด VSCode Terminal
-
ติดตั้ง Packages ของโปรเจ็ค (สามารถแก้ไขเลขเวอร์ชั่นของ Packages, Libraries ต่างๆ ให้เป็นเวอร์ชั่นล่าสุด ก่อนทำการติดตั้งได้ ที่ในไฟล์ package.json)
npm install
- Run เว็บโปรเจ็ค
npm start
- Start
- State x Object
- State x Array (Add)
- State x Array (Delete)
- State x Array (Edit)
- useEffect
- useEffect return
- useContext
- useContext x useState
- useContext x useReducer
- useRef
- forwardRef
- Layout Components
- CSS Modules
- styled-components
- React Router basic routes
- React Router nested routes
- React Router dynamic routes
- React Testing Library