nextjs app router training
1.0.0
ไซต์นี้แนะนำรูปแบบพื้นฐานที่หลากหลายสำหรับเราเตอร์แอป next.js เพื่อทำความเข้าใจวิธีการทำงาน
โครงการนี้มีจุดมุ่งหมาย
| ตัวอย่าง | ใจดี | สถานะ |
|---|---|---|
| เค้าโครงทำรัง | เค้าโครง | |
| เทมเพลต | เค้าโครง | |
| การเขียนทับข้อมูลเมตา | ข้อมูลเมตา | |
| การสร้างภาพ OpenGraph | ข้อมูลเมตา | |
| ส่วนประกอบเซิร์ฟเวอร์ | การแสดงผล | |
| รูปแบบการจัดองค์ประกอบเซิร์ฟเวอร์และไคลเอนต์ | การแสดงผล | |
| น้ำหนักบรรทุก RSC | การแสดงผล | |
| ส่วนประกอบไคลเอนต์และเซิร์ฟเวอร์ | ขั้นพื้นฐาน | |
| การจัดกลุ่ม | กลุ่มเส้นทาง | |
| กำลังโหลดทันที | การโหลด | |
| กำลังโหลดด้วยสตรีมมิ่ง | การโหลด | |
| กำลังโหลดด้วยข้อมูลการโหลดล่วงหน้า | การโหลด | |
| ข้อผิดพลาดทันที | ข้อผิดพลาด | |
| ไม่พบ | ข้อผิดพลาด | |
| ส่วนเดียว | เส้นทางไดนามิก | |
| กลุ่มจับทั้งหมด | เส้นทางไดนามิก | |
| ส่วนเสริมทุกกลุ่ม | เส้นทางไดนามิก | |
| เส้นทางขนาน | เส้นทางขนาน | |
| เส้นทางตามเงื่อนไข | เส้นทางขนาน | |
| เส้นทางที่สกัดกั้น | เส้นทางที่สกัดกั้น | |
| Modal พร้อมเส้นทางคู่ขนาน | เส้นทางที่สกัดกั้น | |
| ข้อมูลแคช | การดึง | |
| ขอบันทึกความทรงจำ (@Server) | การแคช | |
| แคชข้อมูล (@Server) | การแคช | |
| แคชเส้นทางเต็ม (@Server) | การแคช | |
| แคชเราเตอร์ (@client) | การแคช | |
| ตัวจัดการเส้นทาง | ตัวจัดการเส้นทาง | |
| ส่วนเส้นทางแบบไดนามิก | ตัวจัดการเส้นทาง | |
| การกระทำของเซิร์ฟเวอร์ | การกระทำของเซิร์ฟเวอร์ | |
| องค์ประกอบที่ไม่ใช่ฟอร์ม | การกระทำของเซิร์ฟเวอร์ | |
| การอัปเดตในแง่ดี | การกระทำของเซิร์ฟเวอร์ | |
| ทำให้เสีย | ความปลอดภัย | |
| เซิร์ฟเวอร์สิ้นสุด env เท่านั้น | ความปลอดภัย | |
| ช้อปปิ้ง | การแสดง |
ยินดีต้อนรับสู่การส่งตัวอย่างใหม่ แต่โปรดเขียนโค้ดที่ง่ายที่สุดเท่าที่จะทำได้เพื่อทำความเข้าใจผู้เริ่มต้น!
$ git clone [email protected]:hiroppy/nextjs-app-router-training.git
$ cd nextjs-app-router-training
$ npm i
$ mkdir src/app/examples/new-example
# adding code to src/app/examples/new-example
$ # editing src/app/examples/data.ts to add meta data, please refer type definitions
$ npm run generate
$ # editing a table in README.md 
