ภาพหัวบท 6 · AI ใส่ซอส
บทที่ 6 · Serve

เปลี่ยนซอสเป็น
HTML ไฟล์มีชีวิต

นี่ไม่ใช่คลาสสำหรับคนอยากทำเว็บไซต์ แต่คือคลาสสำหรับคนที่อยาก เสิร์ฟความคิดให้คนอื่นเปิด ใช้ และเดินต่อได้จริง

🥩 เมนคอร์ส📄 ไฟล์เดียว📱 เปิดได้บนโทรศัพท์🌍 ส่งให้ 1 คนหรือทั้งโลก
เชฟในชุดสีขาวเสิร์ฟสเต็กเนื้อย่างพร้อมซอสและผัก
TL;DR · จบบทต้องมีไฟล์เว็บ

ซอส 1 ขวด → หน้าเว็บ 1 ไฟล์ ที่ส่งให้คนอื่นเปิดได้

เริ่มจาก AI ตัวที่รู้จักคุณที่สุด ให้มันสรุปเฉพาะเรื่องที่เปิดให้คนอื่นอ่านได้ลงในซอส .md จากนั้นเปิดแชตใหม่ แนบไฟล์ แล้วสั่งสั้น ๆ ว่า “ทำเว็บตามซอสนี้”

ของกลับบ้าน
🧴 ซอสประวัติของคุณ .md 🌓 โครงงานและชีวิตในซอสเดียว 📄 หน้าเว็บ index.html 1 ไฟล์ ✅ เช็กลิสต์ก่อนเปิดให้คนอื่นดู

HTML ไม่ได้แปลว่า “เว็บไซต์” อย่างเดียว

มันคือภาชนะที่เบราว์เซอร์ทั่วโลกอ่านเป็นภาษาเดียวกัน

บริษัทระดับ Apple ธนาคาร มหาวิทยาลัย ร้านค้า และหน่วยงานทั่วโลกส่งประสบการณ์ผ่านหน้า HTML ทุกวัน เพราะมันเปิดได้บนอุปกรณ์แทบทุกชนิดที่มีเบราว์เซอร์

ก่อนยุค AI หน้า Interactive ที่ดีเคยเป็น หนึ่งในสื่อที่แพงที่สุดชนิดหนึ่ง เพราะต้องใช้คนเขียนเนื้อหา นักออกแบบ นักพัฒนา คนทดสอบ และระบบ Hosting ประกอบกัน แต่วันนี้คนที่มีซอสชัดสามารถให้ AI ช่วยประกอบต้นแบบทั้งหน้าได้ในเวลาไม่นาน

📝บทความและคู่มือ

หัวข้อ ตาราง เช็กลิสต์ เอกสารอบรม และ FAQ

🖼️ภาพและแกลเลอรี

ภาพประกอบ Portfolio แผนภาพ และการ์ตูนหลายหน้า

🎬วิดีโอและเสียง

คลิปสาธิต Podcast เพลง คำบรรยาย และ Transcript

🎮เกมและระบบโต้ตอบ

ปุ่ม แบบฟอร์ม เครื่องคิดเลข Quiz การ์ด และเกมเต็มรูปแบบ

🌏หลายภาษาในหน้าเดียว

เก็บไทย อังกฤษ ญี่ปุ่น หรือภาษาอื่นไว้ด้วยกัน แล้วให้ผู้ใช้เลือกภาษาที่ต้องการได้

🧠ความจำในเครื่องโดยไม่ต้องล็อกอิน

จำความคืบหน้า ทางเลือก คะแนน หรือสิ่งที่เปิดไว้ผ่านเบราว์เซอร์ของแต่ละคน

ในบรรดาไฟล์ที่คนทั่วไปคุ้นเคย `.html` เป็นได้เกือบทุกอย่างในไฟล์เดียว

PDF เก่งเรื่องคงรูป วิดีโอเก่งเรื่องภาพเคลื่อนไหว รูปภาพเก่งเรื่อง 1 เฟรม แต่ HTML เรียกสิ่งเหล่านั้นมาอยู่ร่วมกัน แล้วเพิ่มกฎ การตอบสนอง และความจำเข้าไปได้อีก

พูดให้ตรง: HTML เป็นโครงสร้าง ส่วน CSS ทำหน้าตา และ JavaScript ทำพฤติกรรม แต่ทั้ง 3 อย่างสามารถบรรจุอยู่ในไฟล์ index.html เดียวได้

เว็บนี้เริ่มจากไฟล์ชื่อ `index.html`

จากหน้าเดียว เชื่อมต่อจนกลายเป็นบ้านทั้งหลัง

📄index.html

ไฟล์แรกไม่ได้รู้ว่าตัวเองจะกลายเป็นโลก

มันเริ่มจากประตูหน้า แล้วมีเข็มทิศคอยชี้ทาง ก่อนจะแตกแขนงเป็นบ้าน โรงตีเหล็ก ร้านเกม โรงเรียน การ์ดประจำตัว และเส้นทางใหม่ที่ยังสร้างต่อได้

🚪 ประตู🧭 เข็มทิศ🏠 บ้าน⚒️ โรงตีเหล็ก🎴 ร้านเกม🏫 โรงเรียน?
ที่อยู่เดิม

อัปเดตไฟล์ข้างหลัง แล้วทุกคนเปิด URL เดิมเห็น Version ใหม่

เข้าถึงทันที

วางไว้ในเว็บบริษัท คนทั้งทีมเปิดผ่านโทรศัพท์ได้โดยไม่ต้องส่งไฟล์ใหม่ทุกครั้ง

สถานะไม่เหมือนกัน

เว็บนี้ไม่บังคับล็อกอิน แต่เบราว์เซอร์แต่ละเครื่องจำเส้นทางและของที่ผู้เล่นเปิดไว้เอง

นี่จึงไม่ใช่ “ไฟล์หน้าเว็บ” อย่างเดียว แต่มันคือ ไฟล์ที่มีชีวิต — เปลี่ยนได้ เติบโตได้ จำสิ่งที่เกิดขึ้นได้ และพาคนไปต่อจากจุดเดิมได้

SERVE · SMART RESUME

ทำ Smart Resume ให้ได้วันนี้

จังหวะเดียวกับบท 2 และ 3: ใช้ซอสแม่สกัดซอสลูก → ใช้ซอสลูกสร้างงานด้วยคำสั่งสั้น → ตรวจงานที่ได้กลับไปที่ซอส

สามขั้นตอนของการปรุงจากซอส · ขั้นที่ 1 ใช้ซอสแม่สกัดซอสลูก · ขั้นที่ 2 ใช้ซอสลูกสร้างงาน เช่น สไลด์ เอกสาร หรือภาพ · ขั้นที่ 3 ตรวจงานที่ได้จากซอสว่าตรงเป้าหมาย ครบถ้วน ชัดเจน และพร้อมใช้
ทุกบทตั้งแต่นี้ไปใช้จังหวะเดียวกัน — ซอสแม่ให้ซอสลูก ซอสลูกให้งาน แล้วตรวจงานกลับไปที่ซอส
1

ใช้ซอสแม่ สกัดซอสลูกสำหรับ Smart Resume

แนบซอสแม่จากบทที่ 1 แล้ววาง Prompt นี้ ไฟล์ที่ได้ต้องเก็บทั้ง ข้อมูลเจ้าของ + WORK / LIFE + สไตล์ + กติกาสร้าง index.html ไว้ครบ เพื่อรอบถัดไปไม่ต้องอธิบายใหม่ ผลลัพธ์คือ resume-source-YYYY-MM-DD-HHmm.md ที่มีวันเวลากำกับไว้ในชื่อ

ยังไม่มีซอสแม่ก็ทำได้ แต่อย่าเริ่มจากแชทว่างถ้ามีซอสแม่ให้แนบก่อน ถ้ายังไม่มี ให้ทำข้อนี้ใน AI หรือแชทที่รู้จักคุณมากที่สุด Prompt จะไปค้นจาก Memory และประวัติอื่นที่ระบบเข้าถึงได้จริงเพิ่มให้เอง แต่คัดเฉพาะเรื่องที่เหมาะกับการเปิดสาธารณะ ถ้ามันเข้าถึงอะไรไม่ได้ ห้ามอ้างว่าเห็นและห้ามเดาแทน
สกัดข้อมูลเกี่ยวกับฉันจากบริบททั้งหมดที่ AI ตัวนี้เข้าถึงได้จริง แล้วสร้างเป็น Source / ซอส ไฟล์ Markdown (.md) ที่พร้อมใช้สร้าง “Smart Resume” แบบ Single-file HTML ได้ทันที โดยคำสั่งสำหรับสร้างเว็บทั้งหมดต้องถูกรวมอยู่ในไฟล์ .md นี้แล้ว แหล่งข้อมูลที่ให้สำรวจ เรียงตามลำดับ: 1. ซอสแม่ (.md) ที่ฉันแนบมา ถ้ามี — ใช้เป็นฐานหลักเสมอ 2. บทสนทนาปัจจุบัน 3. ถ้าข้อมูลจาก 1 และ 2 ยังไม่พอสำหรับหัวข้อใด และระบบนี้มี Memory, โปรไฟล์, Personal Context หรือประวัติแชทอื่นของบัญชีนี้ที่เข้าถึงได้จริง ให้ค้นและรวบรวมข้อมูลเกี่ยวกับฉันจากบริบทเหล่านั้นเพิ่ม เพื่อให้ Source รู้จักเจ้าของมากที่สุด - ถ้าระบบเข้าถึงแชทอื่นไม่ได้ ห้ามอ้างว่าเข้าถึงได้ และห้ามแต่งข้อมูลมาชดเชย - ถ้าข้อมูลขัดกัน ให้ยึดซอสแม่ก่อน แล้วจึงยึดข้อมูลล่าสุดที่เจ้าของระบุหรือแก้ไขเอง ถ้ายังยืนยันไม่ได้ให้ตัดออก ตั้งชื่อไฟล์ว่า resume-source-YYYY-MM-DD-HHmm.md โดยใช้วันและเวลาปัจจุบันขณะสร้างไฟล์ ถ้าระบบไม่รู้เวลาจริง ให้คงตัวอักษร YYYY-MM-DD-HHmm ไว้ตามนั้น เพื่อให้ฉันเติมเอง PUBLIC-SAFE FILTER — สำคัญมาก: - ใส่เฉพาะข้อมูลที่เหมาะสำหรับเปิดบนเว็บไซต์สาธารณะ - ห้ามใส่รหัสผ่าน, API key, token, เลขบัตร, เลขบัญชี, ที่อยู่บ้าน, ข้อมูลสุขภาพหรือการเงินส่วนตัว, ข้อมูลลูกค้า/บริษัทที่เป็นความลับ หรือข้อมูลของบุคคลอื่นที่ไม่ควรเผยแพร่ - เบอร์โทร อีเมลส่วนตัว ที่อยู่ และข้อมูลครอบครัว ให้ใส่เฉพาะเมื่อบริบทระบุชัดว่าเจ้าของใช้เปิดเผยต่อสาธารณะอยู่แล้ว - ถ้าไม่แน่ใจว่าข้อมูลใดควรเปิดสาธารณะ ให้ตัดออกจาก Source โดยไม่ต้องใส่ค่าจริงไว้แม้ในหัวข้อ “ห้ามใช้” - ใช้เฉพาะข้อเท็จจริงที่มีหลักฐานจากบริบท ห้ามเดา ห้ามขยายความสำเร็จ ห้ามสร้างตำแหน่ง ปี ตัวเลข ลูกค้า รางวัล หรือผลงานเพิ่มเอง สร้างไฟล์ .md ตามโครงนี้: # ซอสลูก (Smart Resume Source) > เอกสารนี้คือ “ซอส” (Source) สำหรับสร้าง Smart Resume ของเจ้าของข้อมูล เก็บทั้งข้อมูล สไตล์ และกติกาสร้างเว็บไว้ครบแล้ว > เมื่อแนบไฟล์นี้ให้ AI แล้วสั่งเพียง “ทำเวปตามซอสนี้” ให้ถือว่า “ซอส” หมายถึงไฟล์นี้ และให้ทำตาม BUILD DIRECTIVE ด้านล่างทันทีโดยไม่ต้องถามเพิ่ม ## ข้อมูลไฟล์ - ชื่อไฟล์: resume-source-YYYY-MM-DD-HHmm.md - สร้างเมื่อ: (วัน เดือน ปี และเวลาที่สร้างไฟล์นี้) - ซอสแม่ที่ใช้: (ชื่อไฟล์ซอสแม่ที่แนบมา หรือระบุว่าไม่ได้แนบ) - แหล่งข้อมูลที่ใช้: (ระบุว่าส่วนไหนมาจากซอสแม่ ส่วนไหนมาจากบทสนทนา และส่วนไหนมาจากบริบทอื่น) ## 0. BUILD DIRECTIVE — คำสั่งที่ต้องใช้สร้าง index.html - สร้างไฟล์ `index.html` ฉบับเต็มเพียงไฟล์เดียว พร้อมใช้งานทันที - Self-contained: HTML + CSS + JavaScript ที่จำเป็นอยู่ในไฟล์เดียว ไม่ใช้ Framework หรือ dependency ภายนอกถ้าไม่จำเป็น - เปิดไฟล์ด้วย Browser ได้โดยตรง และ Responsive ทั้งมือถือ Tablet และ Desktop - หน้าเป็น Smart Resume ที่มีมุม WORK และ LIFE ให้ผู้ใช้กดสลับได้จริง ถ้าข้อมูลบางหมวดไม่มี ให้ตัด section นั้นออก ห้ามสร้างข้อมูลเติมให้ครบ - WORK ใช้เล่าเฉพาะบทบาท ประสบการณ์ ทักษะ โปรเจกต์ ผลงาน ผลลัพธ์ และ Timeline ที่ Source รองรับ - LIFE ใช้เล่าเฉพาะตัวตน ความสนใจ คุณค่า ไลฟ์สไตล์ เรื่องราว หรือสิ่งที่ให้ความสำคัญที่ Source รองรับ - ใช้ Hero, Card, Table, Timeline, Tag, Quote หรือองค์ประกอบอื่นเฉพาะเมื่อช่วยให้ข้อมูลจริงอ่านง่ายขึ้น ไม่ทำกล่องเพราะอยากให้ดูเยอะ - ถ้ามีภาพหรือ Public URL ที่ Source อนุญาตให้ใช้ จึงค่อยใช้ ถ้าไม่มี ห้ามสร้างรูปบุคคลปลอมขึ้นมาแทนเจ้าของ - ถ้ามี Link ให้ใช้เฉพาะ Link ที่ Source ระบุว่าเผยแพร่ได้ - มี Visual hierarchy ชัด อ่านง่าย ตัวหนังสือไม่เล็ก ปุ่มกดง่าย และองค์ประกอบไม่ล้นจอ - Transition ลื่นและเรียบร้อย แต่ต้องรองรับ `prefers-reduced-motion` - ใช้ Semantic HTML, Keyboard navigation, Focus state และ Contrast ที่อ่านได้ - ห้ามมี Tracker, API key, Credential, Backend form หรือการส่งข้อมูลออกจากเครื่องโดยที่ Source ไม่ได้สั่ง - ห้ามใส่ Placeholder ที่ดูเหมือนข้อเท็จจริงจริง ถ้าไม่มีข้อมูลให้ตัดส่วนนั้นออก - ชื่อ ตำแหน่ง ปี ตัวเลข ผลงาน และ Claim ทุกอย่างต้องย้อนกลับมาหา Source นี้ได้ - เลือกภาษาและน้ำเสียงตามข้อมูลเจ้าของ ถ้าภาษาไทยเป็นหลักให้ใช้ `lang="th"` - ตั้งชื่อหน้า (title) และ meta description จากข้อมูล Public-safe ที่มีจริง - ส่งกลับเป็นโค้ด `index.html` ฉบับเต็มในครั้งเดียว พร้อมใช้งาน ไม่ถามคำถามเพิ่มก่อนสร้าง ## 1. PUBLIC IDENTITY — เจ้าของคือใคร สรุปชื่อที่ใช้สาธารณะ บทบาทปัจจุบัน คำอธิบายตัวเองแบบสั้น พื้นที่ความเชี่ยวชาญ และบริบทที่คนทั่วไปควรรู้ โดยใช้เฉพาะข้อมูลที่เปิดเผยได้ ## 2. WORK — เรื่องงาน รวบรวมเฉพาะข้อมูลจริงที่มี เช่น บทบาท งานที่ทำ ทักษะ วิธีทำงาน โปรเจกต์ ผลงาน ผลลัพธ์ ประสบการณ์ จุดเปลี่ยน และ Timeline พร้อมปี/ตัวเลขเฉพาะที่ยืนยันได้ ## 3. LIFE — เรื่องชีวิตและตัวตน รวบรวมความสนใจ งานอดิเรก คุณค่า วิธีคิด ไลฟ์สไตล์ เรื่องราวหรือจุดเปลี่ยนที่เจ้าของเคยเล่า และสิ่งที่ช่วยให้คนรู้จักตัวตนมากขึ้น โดยคัดเฉพาะเรื่องที่เหมาะกับการเปิดสาธารณะ ## 4. CURRENT FOCUS — ตอนนี้กำลังทำอะไร สรุปสิ่งที่กำลังสร้าง เป้าหมายปัจจุบัน โปรเจกต์ที่กำลังเดิน และทิศทางถัดไป เฉพาะข้อมูลล่าสุดที่มีจริง ## 5. PROOF / PROJECTS / ACHIEVEMENTS รายการผลงาน โปรเจกต์ รางวัล ตัวเลข หรือหลักฐานที่ใช้บนหน้าได้ พร้อมบริบทสั้น ๆ ห้ามใส่รายการที่ยืนยันจากข้อมูลไม่ได้ ## 6. VOICE & PERSONALITY สรุปน้ำเสียง วิธีพูด บุคลิก คำที่ชอบ/ไม่ชอบ และพลังงานที่หน้าเว็บควรถ่ายทอด โดยแยกให้ชัดว่าอะไรเป็นข้อมูลที่เห็นจากบทสนทนา ไม่ตีความเป็นข้อเท็จจริงส่วนบุคคลเกินหลักฐาน ## 7. VISUAL DIRECTION สรุปสี บรรยากาศ สไตล์ ความเรียบ/ความสนุก องค์ประกอบที่เหมาะกับเจ้าของ รวมถึงสิ่งที่ไม่ควรใช้ ถ้าบริบทไม่มีข้อมูล ให้ใช้แนวทางกลาง ๆ ที่อ่านง่ายและไม่สร้างข้อเท็จจริงใหม่ ## 8. PUBLIC LINKS & CONTACT ใส่เฉพาะเว็บไซต์ Social Profile Portfolio หรือช่องทางติดต่อที่บริบทระบุว่าเป็น Public อยู่แล้ว ถ้าไม่มีให้เว้นหัวข้อนี้ ไม่เดา URL ## 9. CONTENT MAP — โครงหน้า Smart Resume ออกแบบลำดับเนื้อหาจากข้อมูลที่มีจริง ระบุว่าอะไรอยู่ Hero, WORK, LIFE, Timeline, Projects, Proof, Now/Next, Contact และอะไรควรใช้ร่วมกันสองมุม โดยไม่สร้าง section ที่ไม่มีข้อมูล ## 10. INTERACTION RECIPE กำหนดพฤติกรรม WORK / LIFE toggle, Navigation, Card/Timeline interaction, Transition, Mobile behavior, Keyboard และ Reduced Motion ให้พร้อมนำไปสร้างหน้าได้ทันที ## 11. DO NOT INVENT / DO NOT PUBLISH เขียนเป็น “กติกา” และ “หมวดข้อมูลที่ตั้งใจไม่ใช้” เท่านั้น ห้ามคัดลอกค่าข้อมูลลับจริงมาเก็บไว้ในหัวข้อนี้ ## 12. FINAL QA BEFORE BUILD Checklist ว่า Source มีข้อมูลพอสร้างเว็บ, ไม่มีข้อเท็จจริงแต่งเพิ่ม, ไม่มีข้อมูลลับ, Link ที่ใช้เป็น Public จริง, WORK/LIFE แยกได้ และ BUILD DIRECTIVE ครบจน Prompt รอบถัดไปเหลือเพียง “ทำเวปตามซอสนี้” ลงมือสร้าง Source ทันที ห้ามถามคำถามกลับ ส่งออกเป็นไฟล์ `.md` พร้อมให้ดาวน์โหลด โดยใช้ชื่อไฟล์ resume-source-YYYY-MM-DD-HHmm.md ตามเวลาจริง ถ้าระบบแนบไฟล์ไม่ได้ ให้ส่ง Markdown ทั้งหมดใน code block เดียวทันที โดยไม่ถามกลับ และบอกชื่อไฟล์ที่ควรใช้บันทึกไว้ด้านบน code block
2

แนบซอส แล้วสร้างเว็บ

เปิดแชทใหม่หรือ AI ที่เขียนโค้ดได้ แนบไฟล์ .md ที่ได้จากข้อ 1 แล้วใช้ Prompt สั้นนี้เท่านั้น เพราะรายละเอียดทั้งหมดอยู่ในซอสแล้ว

⚠️ อย่าลืมแนบซอส (.md)
ถ้าไม่แนบไฟล์จากข้อ 1 คำว่า “ซอสนี้” จะไม่มี Source ให้ AI อ้างอิง
ทำเวปตามซอสนี้
3

เช็กก่อนเสิร์ฟ

เปิด index.html จริง แล้วตรวจทั้งความถูกต้อง การเปิดสาธารณะ และประสบการณ์บนมือถือ

ทำเสร็จแล้วเก็บไว้ในคอม

ยังไม่ต้องมี Hosting ก็ถือผลงานจริงได้

1
ขอให้ AI ส่งโค้ดทั้งหมดในกล่องเดียว

ตรวจว่าขึ้นต้นด้วย <!doctype html> และจบด้วย </html> ห้ามเอาคำอธิบายนอกโค้ดติดมาด้วย

2
เปิดโปรแกรม Text Editor ธรรมดา

วางโค้ด แล้ว Save As ชื่อ index.html เลือก UTF-8 ถ้ามีตัวเลือก อย่าให้โปรแกรมแอบเติม .txt ต่อท้าย

3
ดับเบิลคลิกไฟล์

เบราว์เซอร์จะเปิดให้ทันที แม้ยังไม่ได้เอาขึ้นอินเทอร์เน็ต คุณจึงทดสอบ แก้ และพกไฟล์นี้ไปเปิดเครื่องอื่นได้

4
แก้ซอสก่อน แล้วค่อยให้ AI แก้หน้า

ถ้าข้อมูลผิด อย่าซ่อมเฉพาะสีหรือประโยคปลายทาง แก้ซอสต้นฉบับ แล้วสั่งให้สร้าง Version ใหม่จากซอสที่ถูกต้อง

⚠️ ถ้าโค้ดขาดกลางคัน — AI พลาดได้ และนี่คือทางถอย

อาการ: โค้ดหยุดกลางบรรทัด หรือไม่มี </html> ปิดท้าย บันทึกไปแล้วเปิดมาหน้าเพี้ยนหรือว่างเปล่า

ไม่ใช่ความผิดคุณ และไม่ได้แปลว่าซอสไม่ดี — AI ทุกตัวมีเพดานความยาวของคำตอบหนึ่งครั้ง หน้าเว็บไฟล์เดียวที่มีทั้ง HTML, CSS และ JavaScript มักยาวเกินเพดานของรุ่นฟรี นี่คือข้อจำกัดของเครื่องมือ ไม่ใช่สัญญาณว่าให้เลิก
ทาง 1 · สั่งให้เขียนต่อ (ลองอันนี้ก่อน)

อย่าสั่งว่า “ส่งใหม่ทั้งหมด” เพราะจะโดนตัดที่เดิม ให้สั่งต่อจากจุดที่ค้าง แล้วเอาโค้ดที่ได้ไปต่อท้ายในไฟล์เดิมของคุณเอง

เขียนต่อจากบรรทัดสุดท้ายที่ค้างไว้ทันที ห้ามเริ่มใหม่ ห้ามสรุป และห้ามใส่คำอธิบายใด ๆ ส่งเฉพาะโค้ดส่วนที่เหลือจนจบไฟล์
ทาง 2 · สั่งแบ่งส่งตั้งแต่แรก

ถ้าขาดซ้ำหลายรอบ ให้บอกว่า “แบ่งส่งเป็น 3 ครั้ง ครั้งละส่วน ส่งครั้งที่ 1 ก่อน แล้วรอฉันบอกว่าต่อ” จากนั้นต่อโค้ดเรียงกันในไฟล์เดียว

ทาง 3 · ขอฉบับสั้นลงก่อน

บอกว่า “ทำฉบับสั้นลง ตัด section ที่ซอสมีข้อมูลน้อยที่สุดออกก่อน” ได้หน้าที่เปิดได้จริงก่อน แล้วค่อยขอเพิ่มทีละส่วนทีหลัง

เช็กทุกครั้งก่อนบันทึก: ไฟล์ต้องขึ้นต้นด้วย <!doctype html> และบรรทัดสุดท้ายต้องเป็น </html>

ใช้ไฟล์ index.html ที่ AI สร้างจากซอสของคุณเป็นผลงานจริง ส่วนปุ่มดูตัวอย่าง Smart Resume อยู่ใน 3 Step ด้านบน

ส่งต่อโดยยังไม่เอาขึ้นเว็บ

ไฟล์เดียวก็เดินทางได้แล้ว

OPTIONAL · HARD MODE · PUBLIC INTERNET

เอาไฟล์ขึ้น GitHub แล้วรับลิงก์จริง

ส่วนนี้ข้ามได้ทั้งหมด จานหลักจบตั้งแต่คุณเปิดไฟล์ในเครื่องและส่งต่อได้แล้ว แต่ถ้าจะให้คนทั้งโลกเปิด URL เดียวกัน คุณกำลังจะเข้าสู่พื้นที่สาธารณะจริง

🎯 เควสท้ายบท · เสิร์ฟไฟล์แรก

ไม่ต้อง Publish ก็ผ่าน จานนี้วัดว่าคุณเปลี่ยนซอสให้เป็นของที่เปิดใช้ได้หรือยัง

🥩 MAIN COURSE SERVED · ซอสของคุณออกจากแชตและกลายเป็นของที่เปิดใช้ได้แล้ว
← บท 5 · เลือกงาน แล้วตักผงไปใช้กับซอสห้องเรียนทั้งหมด