สร้างเว็บไซต์ Portfolio ส่วนตัวด้วย AI (Claude Code + Supabase + Vercel)
คอร์สสำหรับมือใหม่ 100% สอนสร้างเว็บ Portfolio ตั้งแต่ศูนย์ ด้วย Claude Code ช่วยเขียนโค้ด เชื่อมต่อ Supabase เก็บข้อมูลจริง และ deploy ขึ้นเว็บจริงบน Vercel พร้อมโดเมนของตัวเอง ครบ 4 โมดูล 15 บท
5.0(11 รีวิว)
เนื้อหาบทเรียน
4 บท · 15 บทเรียน · 5 ชม. 5 นาทีบทที่ 1 · เตรียมความพร้อมและวางแผนเว็บ Portfolio
- รู้จัก Portfolio เว็บที่ดี และวางโครงสร้างเนื้อหา15 นาที
- ติดตั้งเครื่องมือที่ต้องใช้: Node.js, Git, VS Code, Claude Code20 นาที
- เปิดโปรเจกต์ Next.js ตัวแรกด้วย Claude Code22 นาที
- Git & GitHub พื้นฐานสำหรับเก็บโค้ด18 นาที
บทที่ 2 · สร้างหน้าเว็บ Portfolio ด้วย Claude Code
- ออกแบบโครงหน้า (Hero, About, Projects, Contact) ด้วย Prompt ที่ดี18 นาที
- สร้าง Layout และ Component หลักด้วย Claude Code20 นาที
- ใส่ผลงาน (Projects) และปรับ Responsive ด้วย Tailwind CSS22 นาที
- เทคนิคสั่งงาน Claude Code ให้แก้บั๊ก/ปรับ UI อย่างมีประสิทธิภาพ20 นาที
บทที่ 3 · เชื่อม Supabase เก็บข้อมูลจริง
- สร้างโปรเจกต์ Supabase และเข้าใจ Database/Auth/Storage18 นาที
- สร้างตาราง Projects และดึงข้อมูลมาแสดงบนเว็บ22 นาที
- ฟอร์มติดต่อ (Contact Form) บันทึกลง Supabase24 นาที
- อัปโหลดรูปภาพผลงานด้วย Supabase Storage20 นาที
บทที่ 4 · Deploy ขึ้นจริงด้วย Vercel และดูแลต่อเนื่อง
- Deploy เว็บไซต์ขึ้น Vercel และตั้งค่า Environment Variables20 นาที
- ต่อโดเมนของตัวเอง (Custom Domain) และเช็ค SEO เบื้องต้น22 นาที
- ดูแลและอัปเดตเว็บต่อเนื่องด้วย Claude Code24 นาที