Web with Astro 101
เรียนสร้างเว็บด้วย Astro Framework สุดยอด static web ความเร็วสูง แถม case study โปรเจกต์จริง ตั้งแต่เริ่มจน Deploy พร้อมวิธีทำเว็บโหลดไวและโฮสต์ฟรี 0 บาท
เนื้อหาคอร์ส
7 บทเรียน ออกแบบมาเพื่อพัฒนาคุณจากระดับเริ่มต้นสู่ระดับมืออาชีพ
Introduction to Astro
ในบทเรียนแรกนี้ เราจะมาทำความเข้าใจสถาปัตยกรรมพื้นฐานของ Astro และหาคำตอบว่าทำไม Framework ตัวนี้ถึงกลายมาเป็นมาตรฐานใหม่สำหรับการพัฒนาเว็บไซต์ที่เน้นความเร็วและประสิทธิภาพ
Installation & Setup
หลังจากที่เราได้เรียนรู้ทฤษฎีใน EP 1 แล้ว บทเรียนนี้จะเป็นการลงมือปฏิบัติ (Hands-on) โดยเราจะทำการติดตั้งเครื่องมือที่จำเป็น สร้างโปรเจกต์ Astro ขึ้นมาใหม่ พร้อมทั้งติดตั้ง Tailwind CSS เพื่อเตรียมความพร้อมสำหรับการสร้างหน้าเว็บ
ดูบทเรียนทดลองสถาปัตยกรรมและโครงสร้างไฟล์ของ Astro (Project Anatomy)
หลังจากที่เราได้ทำการติดตั้งโปรเจกต์และรันเซิร์ฟเวอร์จำลองสำเร็จใน EP 2 บทเรียนนี้จะพาคุณไปเจาะลึกโครงสร้างไฟล์และโฟลเดอร์ต่างๆ ที่ Astro สร้างขึ้นมา
เขียนโค้ดด้วย AI-First Workflow (Antigravity)
ในยุคที่เครื่องมือปัญญาประดิษฐ์มีความสามารถในการเขียนโค้ดได้อย่างแม่นยำ ทักษะที่สำคัญที่สุดของนักพัฒนาเว็บยุคใหม่จึงไม่ใช่การจดจำคลาสของ CSS ได้ทุกตัว แต่คือทักษะในการ "ออกแบบสถาปัตยกรรม" และ "การสั่งงาน AI"
การปรับแต่ง SEO และประสิทธิภาพขั้นสูงสุด (SEO & Performance Optimization)
Astro ถูกออกแบบมาให้รองรับการทำ SEO (Search Engine Optimization) ได้ดีเยี่ยมตั้งแต่เริ่มต้น (Out-of-the-box) บทเรียนนี้จะพาคุณไปตั้งค่าโครงสร้างพื้นฐานที่จำเป็น เพื่อให้เว็บไซต์ของคุณทำอันดับได้ดีและมีประสิทธิภาพการโหลดที่รวดเร็ว
การเตรียมโดเมนเนมให้พร้อม (เชื่อมโดเมนเนมเข้ากับ Cloudflare)
ในบทเรียนนี้ เราจะมาเรียนรู้วิธีการจดโดเมนเนม และนำโดเมนนั้นมาเชื่อมต่อเข้ากับระบบจัดการ DNS ของ Cloudflare
ขึ้นเว็บจริงด้วยงบ 0 บาท (Deployment to Cloudflare Pages) 2
ในบทเรียนที่ผ่านมา เราได้ใช้ Astro วางโครงสร้าง ใช้ Antigravity ช่วยเขียน UI และปรับแต่ง SEO จนเว็บไซต์ของเราสมบูรณ์แบบบน Localhost ขั้นตอนสุดท้ายนี้คือการนำผลงานของคุณขึ้นสู่โลกอินเทอร์เน็ตของจริง (Production) เพื่อให้ทุกคนสามารถเข้าชมได้
คำถามที่พบบ่อย
ข้อมูลสำคัญก่อนเริ่มเรียนคอร์สนี้
ไม่มีพื้นฐานเขียนโค้ดเลย สามารถเรียนได้ไหม?
โฮสติ้งฟรี 0 บาทจริงไหม? มีค่าใช้จ่ายแอบแฝงหรือเปล่า?
Astro เหมาะกับการทำเว็บไซต์ประเภทไหนที่สุด?
(หมายเหตุ: หากต้องการทำระบบ E-commerce เต็มรูปแบบที่มีระบบตะกร้าและตัดบัตรเครดิตหลังบ้าน อาจจะต้องเชื่อมต่อหรือใช้งานควบคู่กับแพลตฟอร์มอื่นเพิ่มเติมครับ)