ลองใช้ Strapi กับ Next.js กัน (มาทำเว็บ Blog กัน)

☕️ สนับสนุนช่องเราด้วยการสมัครสมาชิกช่องทางนี้ได้เลย    / @mikelopster   ลองไมค์ สัปดาห์นี้มาต่อกันที่หัวข้อ Next.js ด้วย Strapi CMS Headless library ที่ช่วยทำ CMS ออกมาให้ เราจะลองนำ Strapi มาใช้ร่วมกันกับ Next.js กัน โดยเราจะทำกันตั้งแต่เริ่มต้น จนถึง deploy ขึ้น Server ของจริงกันเลย 😆 โดยหัวข้อนี้จะประกอบด้วย 1. รู้จัก Strapi และมาลองเล่น Strapi กัน 2. ทำ Login ผ่าน Strapi และควบคุม Access Control ผ่าน Strapi 3. นำ Next.js ต่อเข้ากับ Rest API ของ Strapi 4. Deploy Strapi และ Next.js ขึ้นบน Server กัน ! ขอย้ำ 1 อย่าง ในหัวข้อนี้เราจะไม่ย้ำพื้นฐานของ Next.js ในหลายๆจุด หากใครฟังจุดไหนแล้วงง Concept ของ Next.js สามารถย้อนกลับไปฟังที่หัวข้อ Next.js ของเราก่อนได้น้า หัวข้อ 00:00 แนะนำ Session 01:44 แนะนำ Strapi และ Headless CMS 07:20 การเชื่อมกันระหว่าง Strapi และ Next.js 08:27 setup strapi project 11:40 Strapi - การเพิ่ม Schema collection 17:23 Strapi - การเพิ่ม Content เข้า Schema นั้น 18:50 Strapi - การดึงข้อมูลผ่าน Rest API (และ Permission) 22:59 Strapi - เพิ่ม Schema แบบ Single Type และ API 25:25 Strapi - Rest API กับ populate 26:35 Strapi - การเพิ่ม Relation ระหว่าง Schema 31:20 Strapi - User และการ login 38:03 คำแนะนำอื่นๆของ Strapi 39:08 Setup Next.js 40:35 Next.js - ดึงข้อมูลจาก Blog ใน Strapi 46:26 Next.js - ดึง Blog แต่ละ id ออกมาได้ 50:25 Next.js - เพิ่ม Link จากหน้า Blog สู่ Blog Detail 51:26 Next.js - เพิ่ม Login และ Server action 59:36 Next.js - ยิง Special Blog (ที่ต้อง Authentication ก่อน) 1:02:48 Next.js - เพิ่ม middleware กั้นสิทธิเฉพาะคน Login 1:11:05 Deploy Strapi สู่ Heroku 1:24:21 Deploy Next สู่ Vercel (ต่อเข้ากับ Strapi) 1:29:21 สรุปทั้งหมดเราทำอะไรไปบ้าง 1:31:04 ขอขอบคุณ Supporter ทุกท่านด้วยหัวใจ 🙏 ฉบับ Document https://mikelopster.dev/posts/next-st... ใครมีข้อสงสัยเพิ่มเติม มาพูดคุยแลกเปลี่ยนความรู้กันได้ที่ Facebook page:   / mikelopster.dev   กันได้เลย พิกัดของด้านหลัง : https://shope.ee/8A54c8cfkf Enjoy ครับ 😘