- Hyperclay รองรับการสร้างเว็บแอปในรูปแบบที่รวม UI, ลอจิก และข้อมูลทั้งหมดไว้ใน ไฟล์ HTML เดียว
- สามารถ แก้ไขได้ทันทีและแชร์แบบเรียลไทม์ ได้จากตัวไฟล์เอง พร้อมควบคุมทั้งหน้าตา การทำงาน และวิธีแก้ไขของแอปได้โดยตรง
- มอบโครงสร้างแบบ รันและบันทึกได้ทันที โดยไม่ต้องมี ขั้นตอน build/deploy แยกต่างหาก, ฐานข้อมูล หรือแบ็กเอนด์ที่ซับซ้อน
- ใช้ไฟล์ HTML เพียงไฟล์เดียวเพื่อ รันแอปได้ทุกที่ ไม่ว่าจะเป็นบนเบราว์เซอร์ เซิร์ฟเวอร์ หรือออฟไลน์ และทุกการเปลี่ยนแปลงจะถูกจัดการเวอร์ชันและกู้คืนได้
- ออกแบบมาเพื่อลด ความซับซ้อนของการพัฒนาเว็บสมัยใหม่ และทำให้ใครก็สร้างแอปอินเทอร์แอกทีฟที่มีชีวิตแบบเรียลไทม์ได้อย่างง่ายดาย
แนะนำ: Hyperclay เว็บแอปมีชีวิตที่สร้างจากไฟล์ HTML เพียงไฟล์เดียว
- Hyperclay มอบประสบการณ์ให้โปรแกรมเมอร์สร้างเว็บแอปราวกับการปั้นผลิตภัณฑ์ ด้วย ไฟล์ HTML แบบพกพา เพียงไฟล์เดียว โดยไม่ต้อง จัดการอินฟราสตรักเจอร์ที่ซับซ้อน
- ตั้งเป้าตัดทอนองค์ประกอบที่เคยเป็นสิ่งจำเป็นในการพัฒนาเว็บแบบเดิม เช่น ไฟล์ตั้งค่า, build, framework, deployment pipeline ให้เหลือโครงสร้างที่สมบูรณ์ได้ด้วยไฟล์เพียงไฟล์เดียว
แนวคิดหลักและข้อดี
- แอปประกอบด้วย ไฟล์ HTML ไฟล์เดียว
- สามารถแก้ไขตัวไฟล์เองแบบเรียลไทม์ผ่าน visual UI และสิ่งที่แก้ไขจะถูก บันทึกถาวรเป็นสถานะของแอป ทันที
- ทั้ง UI, ลอจิก และข้อมูลถูกรวมไว้แบบไดนามิกภายในไฟล์เดียว
- ผู้ใช้สามารถ แก้ไขแอปได้ทันทีเหมือนเอกสาร และแชร์/ดาวน์โหลดการเปลี่ยนแปลงเพื่อนำไปใช้งานแบบออฟไลน์ได้ทันที
- เปรียบได้กับ "Google Docs for interactive code" ที่ให้ทั้งการแชร์ การแก้ไข และการควบคุมความเป็นเจ้าของได้อย่างอิสระ
สรุปฟีเจอร์หลัก
- Direct manipulation: แก้ไขได้ทันทีระหว่างที่แอปกำลังทำงาน การเปลี่ยนแปลงมีผลในทันทีโดยไม่ต้องคอมไพล์หรือรีเฟรช
- What you see is what you build: ไม่ว่าจะปรับ UI หรือแก้ซอร์สโค้ดโดยตรง แอปจะเปลี่ยนตามทันทีโดยไม่มีชั้นกลาง
- การพกพาอย่างแท้จริง: ส่งออกแอปเป็นไฟล์ HTML เพื่อรันแบบเดียวกันได้ทุกที่ (ทั้งบนเซิร์ฟเวอร์และออฟไลน์) และทุกครั้งที่บันทึกจะมีการจัดการเวอร์ชันเพื่อให้กู้คืนได้
- ทั้งหมดนี้เกิดขึ้นได้ โดยไม่ต้องใช้เทคโนโลยีพิเศษใด ๆ ใช้เพียงไฟล์ HTML มาตรฐานแค่ไฟล์เดียว
โครงสร้างทางเทคนิค
- Hyperclay ประกอบด้วย NodeJS server และ ไลบรารี JS ฝั่งไคลเอนต์
- เมื่อหน้า HTML แก้ไข DOM ของตัวเอง ระบบจะส่ง
document.body.outerHTML ที่เปลี่ยนแล้วกลับไปยังเซิร์ฟเวอร์ และไฟล์ HTML นั้นเองจะถูกอัปเดต
- การเปลี่ยนแปลงภายในแอป เช่น คุณสมบัติ checked ของ checkbox จะถูกบันทึกถาวรลงในโค้ด HTML ทำให้เมื่อเข้าถึงครั้งถัดไปก็สามารถจำลองสถานะเดิมได้
- รองรับ การจัดการเวอร์ชัน และ การจัดการสิทธิ์อ่าน/เขียน
ตัวอย่างการใช้งานจริง
- สามารถเขียนและบันทึกแอปทุกประเภท เช่น บล็อกที่แก้ไขได้โดยตรง หรือเช็กลิสต์เวลาทำงาน ทั้งหมดในไฟล์ HTML เพียงไฟล์เดียว
- บันทึกสถานะของแอปลงในเอกสารได้ทันทีผ่าน
contenteditable หรือรูปแบบ <input type="checkbox" persist>
ที่มาและปัญหาที่ต้องการแก้
- จากการสร้างเว็บไซต์หลายสิบแห่งในแต่ละปี จึงเกิดความต้องการว่า ถ้าการเขียนเว็บแอปเป็นธรรมชาติเหมือนการเขียนข้อความก็คงดี
- เว็บไซต์แบบสแตติกดั้งเดิมมีข้อจำกัดตรงที่การเปลี่ยนแปลงเป็นสิ่งชั่วคราว (การกระทำของผู้ใช้ไม่ถูกบันทึก)
- หากต้องการทำ data persistence บนเว็บ มักต้องใช้ความพยายามมากเกินไป เช่น การสร้างฐานข้อมูล, API, template และระบบบัญชีผู้ใช้
- จึงไม่มีประสิทธิภาพสำหรับความต้องการแบบ อยากสร้างเร็ว แก้ไขแบบเรียลไทม์ และแชร์ได้ทันที เช่น prototype, เครื่องมือง่าย ๆ, บันทึกการพัฒนาส่วนตัว หรือบล็อก
วิธีที่ Hyperclay ใช้แก้ปัญหา
- รวม UI, สถานะ และพฤติกรรมไว้ในไฟล์ HTML ไฟล์เดียว
- เปิดใช้งานและแก้ไขได้อย่างง่ายดายเหมือนเปิดแอปเดสก์ท็อป พร้อมสะท้อนผลลัพธ์ขึ้นออนไลน์ได้ทันที
- นำเสนอแนวคิดของวัตถุดิจิทัลแบบคงอยู่ (shared, cloneable, persistent)
- สามารถประยุกต์ใช้กับเครื่องมือหลากหลาย เช่น website builder, เครื่องมือเอกสาร/ไดอะแกรม/พรีเซนเทชัน, dashboard, blog, การสร้างแบบสอบถาม/ควิซ และ data visualization
สรุปแนวคิดทั้งหมด
- เว็บแอปส่วนใหญ่ใช้ HTML อยู่แล้ว
- หากตัดขั้นตอนกลางออกไป ไฟล์ HTML จะทำหน้าที่เป็น ฐานข้อมูล / API / UI ทั้งหมด ทำให้สแตกเรียบง่ายเหลือเพียงไม่กี่บรรทัด
- นักพัฒนาสามารถลดความซับซ้อน และสร้างแอปที่ใช้งานง่ายและดูแลรักษาได้ดีด้วย โค้ดเพียงเล็กน้อย
ตัวอย่างการใช้ Hyperclay
- ไม่ว่าจะเป็นบล็อก เช็กลิสต์ หรือแอปประเภทใด ก็สามารถเขียน เผยแพร่ แชร์ และแก้ไขได้ด้วย HTML เพียงไฟล์เดียว
- ใช้งานได้ทันทีในรูปแบบ
<div contenteditable>내 블로그!</div> และใช้ <input type="checkbox" persist> เพื่อบันทึกแต่ละสถานะลงในเอกสารถาวร
บทสรุป
- Hyperclay นำเสนอวิธีใหม่ในการสร้างอินเทอร์แอกทีฟเว็บแอปที่เบาและพกพาสะดวก โดย ไม่ต้องมีความยุ่งยากของการพัฒนาเว็บ พร้อมให้ทุกคนแชร์ บันทึก และกู้คืนได้แบบเรียลไทม์
- เป็น แพลตฟอร์มเว็บแอปรุ่นถัดไป ที่ไม่ใช่แค่นักพัฒนาหรือนักออกแบบ แต่ใครก็ใช้งานได้ง่าย
ยังไม่มีความคิดเห็น