การสร้างโปรเจกต์
การตั้งค่าโปรเจกต์
คลิกปุ่ม + โปรเจกต์ใหม่ จากแดชบอร์ดโปรเจกต์เพื่อเปิดตัวช่วยสร้าง หน้าจอแรกจะกำหนดค่าพื้นฐานของโปรเจกต์ก่อนที่คุณจะเลือก Tech Stack
ชื่อโปรเจกต์
ป้อนชื่อสำหรับโปรเจกต์ของคุณ ชื่อจะถูกตรวจสอบแบบเรียลไทม์ — ต้องเป็นชื่อโฟลเดอร์ที่ถูกต้อง (ไม่มีอักขระพิเศษเช่น <>:"/\\|?*) และต้องไม่ซ้ำกับโฟลเดอร์ที่มีอยู่ในตำแหน่งที่เลือก
ตำแหน่งโปรเจกต์
ไดเรกทอรีเริ่มต้นที่จะสร้างโฟลเดอร์โปรเจกต์ของคุณ คลิกเรียกดูเพื่อเลือกไดเรกทอรีอื่น โปรเจกต์จะถูกสร้างเป็นโฟลเดอร์ย่อยโดยใช้ชื่อโปรเจกต์
เชื่อมต่อกับ GitHub
เลือกบัญชี GitHub เพื่อสร้างรีโพซิทอรีระยะไกลพร้อมกับโปรเจกต์ในเครื่องของคุณโดยอัตโนมัติ เลือก "ไม่มี (อย่าใช้ GitHub เป็นค่าเริ่มต้น)" เพื่อข้าม
เลือกแพลตฟอร์ม
เลือกหนึ่งในสี่ไทล์แพลตฟอร์มเพื่อกำหนดประเภทโปรเจกต์ที่คุณกำลังสร้าง แต่ละแพลตฟอร์มแสดงตัวเลือกเฟรมเวิร์กและเทคสแตกที่แตกต่างกันในหน้าจอถัดไป
Blank
เครื่องมือ CLI, สคริปต์, ไลบรารี
Desktop
แอป desktop ดั้งเดิม
Web
แอปบนเบราว์เซอร์
Mobile
แอปพลิเคชันอุปกรณ์
ประเภทการสร้าง
เลือกวิธีเริ่มต้นโปรเจกต์:
Fresh Install
สร้างโครงร่างโปรเจกต์ใหม่โดยใช้เครื่องมือเฟรมเวิร์กมาตรฐาน Kaiju Hub AI รันคำสั่ง CLI ที่เหมาะสม (เช่น npm create vite@latest, cargo init, npx create-tauri-app) และติดตั้ง dependency ทั้งหมด
AI-Generated
อธิบายสิ่งที่คุณต้องการสร้างและให้ AI สร้างโปรเจกต์ทั้งหมด คุณให้คำอธิบายข้อความและรูปภาพอ้างอิง (ไม่บังคับ) จากนั้น AI จะเขียนซอร์สโค้ดทั้งหมด ไฟล์การกำหนดค่า และโครงสร้างโปรเจกต์
หลังจากกำหนดค่าโปรเจกต์แล้ว คลิก ดำเนินการต่อไปยัง Tech Stack เพื่อดำเนินการต่อ
โปรเจกต์ Blank
โปรเจกต์ Blank สำหรับเครื่องมือ CLI, สคริปต์, แอปพลิเคชันแบบสแตนด์อโลน และตัวเริ่มต้นเฉพาะภาษา เลือกภาษาหรือรันไทม์ของคุณแล้ว Kaiju Hub AI จะสร้างโครงสร้างโปรเจกต์ขั้นต่ำ
ตัวเลือกภาษา / รันไทม์
บางภาษามีตัวเลือกเวอร์ชัน ตัวอย่างเช่น การเลือก Python จะแสดงตัวเลือกเวอร์ชัน (3.10, 3.11, 3.12, 3.13, 3.14, 3.15) เวอร์ชันที่เลือกจะกำหนดว่าจะใช้ Python interpreter ตัวไหนในการสร้าง virtual environment
โปรเจกต์ Desktop
โปรเจกต์ Desktop สร้างแอปพลิเคชัน desktop ดั้งเดิม เลือกเฟรมเวิร์ก desktop, เฟรมเวิร์ก frontend สำหรับ UI และเลือกฐานข้อมูล (ไม่บังคับ) เฟรมเวิร์ก frontend ทั้งหมดมาพร้อม TypeScript ที่กำหนดค่าไว้แล้ว
เฟรมเวิร์ก Desktop
เฟรมเวิร์กดั้งเดิมที่ให้ shell หน้าต่าง desktop และ API ระดับระบบ
เฟรมเวิร์ก Frontend
เฟรมเวิร์ก UI ที่ทำงานภายในหน้าต่าง desktop ตัวเลือกทั้งหมดกำหนดค่า TypeScript ไว้แล้ว
ฐานข้อมูล
การรวมฐานข้อมูล (ไม่บังคับ) สำหรับจัดเก็บข้อมูลในเครื่องหรือบนคลาวด์
โปรเจกต์ Web
โปรเจกต์เว็บสร้างแอปพลิเคชันบนเบราว์เซอร์ เริ่มต้นด้วยการเลือกระหว่าง Frontend เท่านั้น หรือ Full-Stack เพื่อกำหนดตัวเลือกเฟรมเวิร์กที่มีอยู่ เฟรมเวิร์กทั้งหมดเปิดใช้งาน TypeScript เป็นค่าเริ่มต้น
Frontend เท่านั้น
เฟรมเวิร์ก UI แบบสแตนด์อโลนสำหรับแอปหน้าเดียวและเว็บไซต์ static มีปุ่มแพ็กเกจกำหนดเองเพื่อเพิ่มแพ็กเกจ npm ของคุณเอง
Full-Stack
เฟรมเวิร์กเว็บที่สมบูรณ์พร้อม server-side rendering และ API routes ในตัว
การจัดรูปแบบ
ฐานข้อมูล
โปรเจกต์ Mobile
โปรเจกต์ Mobile สร้างแอปพลิเคชันอุปกรณ์สำหรับ iOS และ Android เลือกเฟรมเวิร์ก mobile, เวอร์ชัน SDK และเลือกฐานข้อมูล (ไม่บังคับ)
เฟรมเวิร์ก Mobile
เลือกเฟรมเวิร์กสำหรับแอปพลิเคชัน mobile ของคุณ ตัวเลือกเวอร์ชัน SDK จะปรากฏสำหรับเฟรมเวิร์กที่รองรับ SDK เป้าหมายหลายตัว
เวอร์ชัน SDK
สำหรับเฟรมเวิร์กเช่น Expo ให้เลือกเวอร์ชัน SDK (เช่น 52, 53, 54, 55) ซึ่งกำหนด dependency พื้นฐานและความเข้ากันได้ของ API
ฐานข้อมูล
ฐานข้อมูลบนคลาวด์หรือในเครื่อง (ไม่บังคับ) สำหรับแอป mobile ของคุณ
Fresh Install
เมื่อคุณเลือก ติดตั้งใหม่ เป็นประเภทการ build Kaiju Hub AI จะ scaffold โปรเจกต์ของคุณโดยใช้เครื่องมือเฟรมเวิร์กมาตรฐาน หลังจากเลือก Tech Stack แล้ว คลิก สร้างโปรเจกต์ และ Kaiju Hub AI จะจัดการส่วนที่เหลือ
จะเกิดอะไรขึ้น
1. ตรวจจับตัวจัดการแพ็กเกจ
Kaiju Hub AI ตรวจจับตัวจัดการแพ็กเกจที่ติดตั้งในระบบของคุณโดยอัตโนมัติ (npm, yarn หรือ pnpm)
2. รันคำสั่งสร้างโครงร่าง
รันเครื่องมือ CLI ที่เหมาะสมสำหรับสแตกที่คุณเลือก ตัวอย่าง: npm create vite@latest สำหรับ React, cargo init สำหรับ Rust, npx create-tauri-app สำหรับ Tauri
3. ติดตั้ง Dependencies
รันคำสั่งติดตั้งตัวจัดการแพ็กเกจเพื่อดาวน์โหลดและตั้งค่า dependency ที่จำเป็นทั้งหมด
4. เริ่มต้น Git
ตั้งค่ารีโพซิทอรี Git ในเครื่องพร้อม commit เริ่มต้น
5. สร้าง GitHub Repo
หากคุณเชื่อมต่อบัญชี GitHub จะสร้างรีโพซิทอรีระยะไกลและ push commit เริ่มต้นโดยอัตโนมัติ
โปรเจกต์จะปรากฏในแดชบอร์ดโปรเจกต์เมื่อการสร้างเสร็จสมบูรณ์ พร้อมเปิดและเริ่มเขียนโค้ด
AI-Generated
เมื่อคุณเลือก สร้างด้วย AI เป็นประเภทการ build คุณอธิบายสิ่งที่ต้องการสร้างและ AI จะเขียน codebase เริ่มต้นทั้งหมด หลังจากเลือก Tech Stack แล้ว คลิก สร้างโปรเจกต์ เพื่อเปิดหน้าจอสร้าง AI
การเลือกโมเดล AI
ที่ด้านบนของหน้าจอสร้าง ให้เลือกผู้ให้บริการ AI และโมเดล คุณสามารถเลือกจากผู้ให้บริการที่กำหนดค่าไว้ (OpenAI, Anthropic, Gemini, Grok, DeepSeek, Ollama) และเลือกโมเดลเฉพาะสำหรับการสร้างโค้ด
คำอธิบายโปรเจกต์
เขียนคำอธิบายโดยละเอียดเกี่ยวกับสิ่งที่คุณต้องการสร้าง ยิ่งเฉพาะเจาะจงมากเท่าไหร่ ผลลัพธ์ก็จะดีขึ้นเท่านั้น ระบุฟีเจอร์หลัก หน้า รูปแบบ UI และการรวมที่คุณต้องการ
ตัวอย่างที่ดี:
- เว็บไซต์อีคอมเมิร์ซพร้อมรายการสินค้าและตะกร้าสินค้า
- แดชบอร์ดจัดการงานพร้อมบอร์ด kanban
- แพลตฟอร์มโซเชียลมีเดียพร้อมโปรไฟล์ผู้ใช้และฟีด
- ระบบ CRM พร้อมการจัดการผู้ติดต่อและการวิเคราะห์
ใช้ปุ่ม ปรับปรุงด้วย AI เพื่อขยายคำอธิบายของคุณโดยอัตโนมัติพร้อมรายละเอียดเพิ่มเติม คุณยังสามารถคลิกกลางที่ไอคอนไมโครโฟนเพื่อบอกคำอธิบายด้วยการป้อนด้วยเสียง
แท็บแถบด้านข้าง
แถบด้านข้างซ้ายให้บริบทเพิ่มเติมสำหรับ AI:
รูปภาพ
อัปโหลดรูปภาพอ้างอิง, mockup หรือภาพหน้าจอเพื่อแสดงให้ AI เห็นว่าคุณต้องการให้แอปมีลักษณะอย่างไร ลากและวาง, วางด้วย Ctrl+V หรือคลิกเพื่อเพิ่ม ต้องเลือกโมเดลที่รองรับ vision
คอมโพเนนต์
แนบคอมโพเนนต์ที่นำกลับมาใช้ได้จาก Block Library AI จะรวมสิ่งเหล่านี้เข้ากับโปรเจกต์ที่สร้าง
ไฟล์
รวมไฟล์อ้างอิงที่ AI ควรพิจารณาระหว่างการสร้าง (เช่น โค้ดที่มีอยู่, สเปคการออกแบบ หรือสคีมาข้อมูล)
สร้าง
คลิก สร้างโปรเจกต์ ที่มุมขวาบนเพื่อเริ่มการสร้างด้วย AI AI จะวิเคราะห์คำอธิบายและเอกสารอ้างอิง วางแผนสถาปัตยกรรม สร้างโครงสร้างไฟล์ และเขียนซอร์สโค้ดและไฟล์การกำหนดค่าทั้งหมด ความคืบหน้าจะถูกติดตามใน ตัวจัดการงานทั่วไป แบบเรียลไทม์
