20/08/2019
การให้ User สามารถตกแต่งหน้าเพจของตัวเองได้เลยก็เป็นเรื่องดีและน่าสนใจ สำหรับระบบงานที่ user สามารถสร้างหน้าของตัวเองได้ เช่นระบบร้านค้าย่อย หรือระบบ Resume ต่างๆ
แต่บอกตามตรงเลยว่าถ้าจะเขียนให้ User มาลากๆวางๆเองได้ขนาดนั้นนะ โคตรจะยากเลย งั้นวันนี้เรามาดูเครื่องมือที่จะช่วยแบ่งเบาภาระตรงนั้นกันดีกว่ากับ VvvebJs ตัวนี้
VvvebJs เป็น JavaScript Library ที่จะช่วยแปรงร่างของ editor ของเราให้กลายเป็น สุดยอดระบบได้ง่ายๆ เพราะว่าผู้ใช้งานสามารถมา ลากวาง ตกแต่ง ได้แบบ wysiwyg เลยทีเดียว
ความสามารถไม่ธรรมดา เพราะว่ามาพร้อมกับ Bootstrap 4 components แล้วดังนั้น คนมาเขียน CSS ก็ไม่ต้องกังวลส่วน User เองก็ทำงานสบายเพราะความง่ายในตัวมันเอง
ทุกอย่างถูกมองเป็น Components กับ blocks ทำให้ user สามารถ drag and drop ได้ตามสะดวก และยังมี Undo Redo เอาไว้ให้กดเวลาผิดพลาดอีกด้วย
interface สวยงามน่าใช้งาน ดูเข้าใจง่าย มีทั้งแบบ 1 ช่องกับ 2 ช่อง ทีเด็ดอยู่ตรงที่ไฟล์ทั้งหมดที่เกี่ยวข้อง ถูกเก็บเป็น hierarchy navigation เพื่อให้ดูและใช้งานง่าย จะสร้างเพจใหม่ภายในก็ได้ด้วยนะ
ส่วนคน Code ก็ไม่ต้องกังวลเพราะว่า Live code editor เค้าสามารถให้เรา Code ได้เลยบนนั้น แต่การจะใช้จริง เรื่องของไฟล์ต่างๆก็ต้องเขีย หลังบ้านเชื่อม่อระบบ upload file เอานะ ในตัวอย่างมีมาเป็น php
ส่วนทำงานเสร็จแล้ว สามารถบันทึกได้เลยเพราะต้องเขียนหลังบ้านเพิ่ม 555 หรือจะแค่ download หรือ export html ออกมาก็ได้ แน่นอนตัวอย่างเป็น php จ๊ะ
ส่วน widgets ก็มีมาให้ด้วยนะ อาจจะยังไม่เยอะ แต่ความที่มันเป็น opensource และยังทำบน js อีกอนาคตน่าจะมาแน่ แต่ตอนนี้ก็ทำได้ทั้ง Youtube, Google maps, Charts.js แล้วก็นับว่าเยอะแล้วนะ
ระบบใครเป็นแบบให้ user สร้างและตกแต่งงหน้าได้เอง ลองเอา Tool เทพๆตัวนี้ไปแกะเล่นครับ ไม่ธรรมดาเลย รับรองว่าถ้า User เห็นแล้วจะอยากใช้งานขึ้นเป็น 10 เท่า
Editor Demo : http://www.vvveb.com/vvvebjs/editor.html
Git Repo: https://github.com/givanz/VvvebJs
