I Built a Claude Code Skill That Starts Any App (CONTINUED)
0:000:00
เล่นเสียงต้นฉบับของวิดีโอ พร้อมแสดงซับไทยซิงก์ตามเวลา
กำลังโหลดวิดีโอ…
01
สรุปย่อ
ประเด็นสำคัญจากวิดีโอ
- **วิดีโอ**: การสร้างความสามารถสำหรับ Claude Code
# สรุปวิดีโอ: I Built a Claude Code Skill That Starts Any App (CONTINUED) ## ข้อมูลหลัก - **วิดีโอ**: การสร้างความสามารถสำหรับ Claude Code - **ผู้สร้าง**: Leon van Zyl - **หัวข้อหลัก**: เครื่องมือสำหรับนักพัฒนาเพื่อเริ่มต้นโปรเจ็กต์ใหม่โดยอัตโนมัติ - **ระยะเวลา**: 1 ชั่วโมง 14 นาที 8 วินาที ## ความสามารถหลัก 1. **เริ่มต้นโปรเจ็กต์ใหม่**: สร้างโปรเจ็กต์จากศูนย์โดยอัตโนมัติ 2. **เลือกเทคโนโลจี**: เอเยนต์เลือกเทคโนโลยีที่เหมาะสมกับความต้องการ 3. **หลีกเลี่ยงปัญหา**: ป้องกันปัญหาการปรับขนาดและการปรับใช้ 4. **กระบวนการง่ายๆ**: ติดตั้งง่าย ใช้งานได้ทันที ## เทคโนโลยีที่รองรับ - **Frontend**: Next.js, React, ShadCN - **Authentication**: Clerk, Auth0 - **AI**: AI SDK with Open Router - **Database**: PostgreSQL, SQLite - **Payment**: Stripe, Polar - **Storage**: Various blob storage options ## คุณสมบัติพิเศษ - **การเลือกที่แม่นยำ**: เอเยนต์เลือกเฉพาะโมดูลที่จำเป็น - **ทักษะที่ทรงประสิทธิภาพ**: หลีกเลี่ยงการติดตั้งสิ่งที่ไม่จำเป็น - **การปรับขนาด**: รองรับการพัฒนาและปรับใช้ในระบบจริง - **ยืดหยุ่น**: สามารถปรับแต่งตามความต้องการ ## การใช้งาน 1. ติดตั้งความสามารถ: `npx skills add https://github.com/leonvanzyl/skills` 2. เลือกระดับการติดตั้ง (project หรือ global) 3. เรียกใช้ความสามารให้สร้างโปรเจ็กต์ใหม่ 4. ตอบคำถามของเอเยนต์เกี่ยวกับความต้องการ 5. รอให้เอเยนต์สร้างโปรเจ็กต์ ## ข้อได้เปรียบ - **ประหยัดเวลา**: ลดเวลาในการตั้งค่าเริ่มต้น - **ลดความซับซ้อน**: ไม่ต้องลบโค้นที่ไม่จำเป็น - **ความสม่ำเสมอ**: ใช้แพ็กเกจที่ทดสอบแล้ว - **การพัฒนาที่รวดเร็ว**: เริ่มต้นได้ทันที ## การพัฒนาอนาคต - การสนับสนุนภาษาเพิ่มเติม - การเพิ่มโมดูลใหม่ๆ - การปรับปรุงประสิทธิภาพ - การรวมกับแพลตฟอร์มอื่นๆ ## บทสรุป ความสามารถนี้เป็นเครื่องมืออันทรงพลังสำหรับนักพัฒนาที่ต้องการเริ่มต้นโปรเจ็กต์ใหม่โดยมีระบบและโครงสร้างที่ถูกต้องตั้งแต่แรก โดยการใช้ AI ในการตัดสินใจเลือกเทคโนโลยีและการติดตั้งโมดูลที่จำเป็น ทำให้ลดเวลาและความซับซ้อนในการพัฒนาอย่างมีนัยสำคัญ การใช้งานง่ายและสามารถปรับแต่งได้ตามความต้องการของแต่ละโปรเจ็กต์ *สร้างขึ้นเมื่อ: 21 กันยายน 2569* *แหล่งที่มา: YouTube KY3DRceajYM*
02
คำแปลเต็ม
แปลตามบทสนทนาต้นฉบับ ปรับเป็นภาษาไทยธรรมชาติ
05
ซับไตเติ้ลภาษาไทย
ดาวน์โหลดหรือดูซับทั้งหมด
1 00:00:00,000 --> 00:00:05,000 เฮ้ ลึกจาก เสียงของอะไรนะเนี่ย ว่าอะไรนะเนี่ย คุณดีใจไหม 2 00:00:05,000 --> 00:00:12,000 >> [เสียงหัวเราะ] >> ขอบคุณมากครับ ดังนั้น นี่จริงๆ แล้วเป็นส่วนที่สองของการสตรีมสดที่ เราเริ่มต้นไปแล้ว แต่ก็เกิดปัญหาเทคนิค และฉันต้องยกเลิกการสตรีมสดนั้นไป 3
thai-subtitles.srt
SubRip — ใช้กับเครื่องเล่นวิดีโอส่วนใหญ่
thai-subtitles.vtt
WebVTT — ใช้กับเว็บ / YouTube
เปิดดูซับไตเติ้ลทั้งหมด (24 segments)
1 00:00:00,000 --> 00:00:05,000 เฮ้ ลึกจาก เสียงของอะไรนะเนี่ย ว่าอะไรนะเนี่ย คุณดีใจไหม 2 00:00:05,000 --> 00:00:12,000 >> [เสียงหัวเราะ] >> ขอบคุณมากครับ ดังนั้น นี่จริงๆ แล้วเป็นส่วนที่สองของการสตรีมสดที่ เราเริ่มต้นไปแล้ว แต่ก็เกิดปัญหาเทคนิค และฉันต้องยกเลิกการสตรีมสดนั้นไป 3 00:00:12,000 --> 00:00:20,000 ดังนั้น ฉันก็เพียงแค่เริ่มต้นต่อจากเรา >> [เสียงดัง] >> นะหน่อยจากที่เราหยุดไว้ โอเค 4 00:00:20,000 --> 00:00:30,000 ดังนั้น คิดว่าเราควรจะดำเนินต่อ แต่โดยสรุปสำหรับคนที่เพิ่งเข้ามา นี่เป็นภาคที่สองของ การสตรีมสดที่เราเริ่มต้นไปแล้ว 5 00:00:30,000 --> 00:00:40,000 แต่บางอย่างผิดพลาด และฉันต้องยกเลิก การสตรีมสดนั้นไป แต่ แค่ว่า เป็นการสรุปสั้นๆ นี่คือความสามารถที่ฉันสร้างขึ้น ที่คุณติดตั้งได้ 6 00:00:40,000 --> 00:00:50,000 คุณติดตั้งได้ในเครื่อง คุณสามารถติดตั้งได้ เช่น ทั่วทั้งระบบของคุณ และนี่คือ ความสามารถเพียงอย่างเดียวที่คุณใช้ เพื่อให้เอเยนต์สร้างโปรเจ็กต์ใหม่ให้คุณ 7 00:00:50,000 --> 00:01:00,000 ดังนั้นมันจะรวมทุกอย่างที่ดีเยี่ยมมาก อย่างหนึ่ง ดังนั้นมันจะสอบถามคุณ เกี่ยวกับความต้องการของคุณ แต่สิ่งที่ทำให้มันน่าสนใจคือ ไม่ซ้ำกันคือเอเยนต์จะเลือก เทคโนโลยีที่จะใช้ตามความต้องการของคุณ 8 00:01:00,000 --> 00:01:10,000 และนี่หลีกเลี่ยงปัญหาหลายอย่าง ที่ผู้คนมักจะเผชิญหน้าเวลาที่ทำงานกับ เอเยนต์ที่คุณจะเหมือน แค่สั่งเอเยนต์ให้สร้างแอปให้คุณ เอเยนต์จะเลือกเทคโนโลยีให้คุณ และจากนั้นเมื่อคุณพยายาม นำโปรเจ็กต์ไปใช้งานจริง มันจะกลายเป็นปัญหา 9 00:01:10,000 --> 00:01:20,000 ทันใดนั้นสิ่งที่เอเยนต์สร้างขึ้น ไม่เข้ากับบริการที่คุณพยายาม นำไปใช้ ซึ่งสิ่งต่างๆจะผิดปกติเมื่อคุณเริ่ม ปรับขนาดแอป มันจะทำให้ยากมาก ถ้าคุณต้องการดูแลแอปเช่นกัน ดังนั้นโดยพื้นฐานนี่คือ ความสามารถนี้รวมกฎและข้อมูลอ้างอิง มากมายเพื่อสอนเอเยนต์ว่าจะใช้เทคโนโลยีใด 10 00:01:20,000 --> 00:01:30,000 และนี่จะอิงจาก โมดูลหรือสแต็กเทคโนโลยี ที่ฉันใช้มาอย่างยาวนาน ในโปรเจ็กต์ของฉัน ดังนั้นมันคล้ายกับ เอ่อ Next.js และ React แต่รวมเข้าด้วย เช่น Clerk สำหรับการยืนยันตัวตนของผู้ใช้ รวมถึง AI SDK กับ open router สำหรับงานใดๆที่เกี่ยวข้องกับ AI 11 00:01:30,000 --> 00:01:40,000 มันรองรับทุกอย่างตั้งแต่ SQLite ไปถึงฐานข้อมูล PostgreSQL เช่นกัน ดังนั้นให้คุณ ความยืดหยุ่นในการรวมระบบชำระเงิน มันรองรับเช่น Stripe และ Polar ด้วย ดังนั้นมีอะไรมากมายที่นี่ แต่สิ่งที่น่าสนใจคือเอเยนต์จะ จะติดตั้งแค่ เอ่อ ขอโทษ 12 00:01:40,000 --> 00:01:50,000 ดังนั้นนี่คือ เอเยนต์จะเลือกเฉพาะ โมดูลที่คุณต้องการสำหรับโปรเจ็กต์ และแล้วหากคุณเคยลอง ใช้เช่นกิจกรรมเริ่มต้นการเขียนโค้ดของฉัน หรืออาจจะเป็นตัวเริ่มโปรเจ็กต์ โครงร่างจากผู้สร้างหรือนักพัฒนาคนอื่น 13 00:01:50,000 --> 00:02:00,000 คุณรู้มันจะรวมเข้าด้วยกัน ด้วยการสั่งคำสั่งนั้น มันจี่ดาวน์โหลดโครงสร้างทั้งหมด ทั้งหมดเข้าไปในโปรเจ็กต์ของคุณ แต่บ่อยครั้งมีอะไรมากมาย ที่คุณต้องการไม่จริงๆ และแค่เพิ่มความซับซ้อนโดยไม่จำเป็น ให้โปรเจ็กต์ของคุณ ดังนั้นนี่จะรับประกันว่าเฉพาะ คอมโพเนนต์ที่จำเป็น จะตั้งค่าตั้งแต่แรก 14 00:02:00,000 --> 00:02:10,000 และถ้าคุณต้องการเพิ่มความสามารถใหม่ เช่นเดียวกันสำหรับตัวอย่าง สมมตว่าคุณต้องการ เพิ่มระบบชำระเงินในอนาคต เอเยนต์สามารถดึงข้อมูลจากกฎเหล่านี้ เพื่อคำนวณว่าคุณ รู้จักระบบชำระเงินอะไร และวิธีรวมเข้ากับแอปของคุณอย่างถูกต้อง 15 00:02:10,000 --> 00:02:20,000 ดังนั้นมันง่ายมากที่ตั้งค่า เอ่อ ฉันจะแสดงให้คุณดูอีกครั้ง ดังนั้นครั้งแรกที่คุณ คุณแค่ต้องทำเพียงครั้งเดียว โดยวิธีนี้ ดังนั้นคุณแค่เรียกใช้คำสั่ง ฉันจะใส่ไว้ใน ชอท เช่นว่าคุณแค่เรียกใช้ คำสั่งนี้ มันจะตรวจสอบให้ โอเคมีแค่หนึ่งอย่าง ที่รู้จักในโปรเจ็กต์นี้ 16 00:02:20,000 --> 00:02:30,000 นั่นคือ เอ่อ นี่เรียกว่าเริ่มต้นแอปความสามารถ และคุณสามารถเลือก แล้วก็เลือกเอเยนต์การเขียนโค้ดของคุณที่นี่ 17 00:02:30,000 --> 00:02:40,000 คุณสามารถเลือกว่าจะติดตั้ง ในระดับโปรเจ็กต์หรือระดับโลก หากคุณต้องการทำเพียงครั้งเดียว และไม่ต้องทำอีกเลย ก็ให้ติดตั้งในระดับโลก ดังนั้นครั้งหน้าที่คุณเริ่มโปรเจ็กต์ ความสามารถนี้จะมีอยู่แล้ว สำหรับโปรเจ็กต์ ฉันได้ติดตั้งในระดับโปรเจ็กต์เพื่อ ให้เห็นการสาธิต ดังนั้นคุณทั้งหมดสามารถเห็น ความสามารถนั้น 18 00:02:40,000 --> 00:02:50,000 ดังนั้นในโฟลเดอร์ความสามารถ มีไฟล์อ้างอิงเล็กๆ ทั้งหมด หากเราเปิด ไฟล์ใดไฟล์หนึ่ง เช่นเดียวกัน ดังนั้นลอดู AI ไฟล์ AI มีไลบรารี ที่เราจะใช้สำหรับการใช้งานใดๆที่เกี่ยวข้องกับ AI ส่วนตัวฉันชอบใช้ AI SDK กับ open router แต่โดยแน่นอนหากคุณคนอื่น ๆ ต้องการใช้อะไรอื่น แคดว่าแค่ไป 19 00:02:50,000 --> 00:03:00,000 ไปที่ไฟล์นี้ แทนที่ ด้วยสิ่งที่คุณชอบในสแต็กเทคโนโลยี ของคุณ ดังนั้นอาจจะ คุณชอบใช้ Claude agent SDK สำหรับโปรเจ็กต์ทั้งหมดของคุณ นั่นก็ดีเหมือนกัน แค่แทนที่ ด้วยสิ่งที่คุณใช้ และผู้ให้บริการที่คุณชอบใช้ ครั้งหน้าที่คุณเริ่มโปรเจ็กต์ โปรเจ็กต์จะเริ่มทำงานแล้ว พร้อมกับทุกส่วนประกอบ ที่คุณต้องการในโปรเจ็กต์ของคุณ เช่นกันสำหรับ Clerk คุณรู้ ฉันใช้ Clerk ในโปรเจ็กต์ของฉัน หากคุณต้องการใช้ Clerk หรืออะไรอื่น ก็เพียงแค่ไปที่ไฟล์นี้ เปลี่ยน สิ่งที่คุณต้องการเปลี่ยน และเสร็จแล้ว 20 00:03:00,000 --> 00:03:10,000 ดังนั้นคุณรู้ว่าคุณสามารถทำตาม ไฟล์เหล่านี้ทั้งหมด เพิ่มสิ่งที่คุณต้องการ ในสแต็กของคุณ แล้วคุณก็พร้อม ดังนั้น ดังนั้นก่อนที่การสตรีมสดจะหยุดไป ก่อนหน้านี้เราทำอะไรบ้างก็คือเราเริ่ม บทสนทนาใหม่ที่เรา สรุปทั้งหมดว่าให้ใช้เริ่ม และความสามารถแอปเพื่อสร้างต่อไป 21 00:03:10,000 --> 00:03:20,000 ลองสร้าง Trello clone ที่ง่ายๆ ซึ่งดึงเข้ามาในเริ่ม และความสามารถแอป เอเยนต์ถามเราปัญหายืนยัน มากมาย แท้จริงแล้วมันกำลังถามเรา ปัญหาอยู่ แต่ที่จุดนั้น การสตรีมสดจบลง เอ่อ ดังนั้นฉันจะดำเนินการ กับปัญหาเหล่านี้ ดังนั้นเราจะไม่ติดตั้ง ความสามารถใดๆของ AI ลงในแอปที่เวลานี้ 22 00:03:20,000 --> 00:03:30,000 แต่สิ่งที่น่าสนใจคือเอเยนต์ จะเป็นการสอบถามคุณ คุณรู้ว่า มันจะถามคุณมากมายเกี่ยวกับสิ่งที่คุณต้องการในแอปของคุณ และนั่นไม่ใช่เทคนิคนะ อย่างนั้น ดังนั้นนี่จริงๆ แล้วเป็นสิ่งที่ ทำให้มันใช้งานง่ายที่สุด 23 00:03:30,000 --> 00:03:40,000 ฉันชอบใช้ไลบรารีแบบโอเพนซอร์สด้วย ฉันชอบมันเช่นกัน [เสียงดัง] โอเค ดังนั้นเอเยนต์กำลัง ติดตั้ง dependency ทั้งหมดนี้ ตอนนี้ และดูที่สิ่งที่ฉันชอบ สิ่งนี้และคุณรู้ว่า นี่คือ นี่คือวิธีที่ฉันเริ่มต้นโปรเจ็กต์ของฉันตอนนี้ ฉันได้หยุดการใช้ กิจกรรมเริ่มต้นการเขียนโค้ด และฉันใช้แทนที่แท้จริง 24 00:03:40,000 --> 00:03:50,000 เอ่อ ฉันคิดว่าเอเยนต์เหล่านี้ จริงๆ แล้วดีในการ เข้าใจวิธีติดตั้ง dependency และวิธีหา ปัญหาใดๆระหว่างไลบรารีต่างๆเหล่านี้ คุณรู้ว่าเมื่อ คุณรู้ว่าเช่นสำหรับ กิจกรรมเริ่มต้นการเขียนโค้ด นั่นเป็นภาระหน้าที่ที่แท้จริงเพราะฉัน ต้องเก็บ package เหล่านี้ไว้เสมอ ตัวเอง