เขียน HTML ให้เร็วปรี๊ดด้วย Zen Coding สำหรับ NetBeans IDE
Zen Coding เป็นปลั๊กอินที่จะช่วยทำให้เราเขียนโค้ด HTML กับ CSS ได้เร็วขึ้น(มากๆ)ครับ ตอนนี้ก็มี IDE และ Editor หลายตัวที่รองรับ (ทั้งเต็มรูปแบบ และบางส่วน) .. รายละเอียดมากกว่านี้ รบกวนไปอ่านที่เว็บผู้พัฒนาเอาเองละกันครับ ผมก็ไม่รู้จะอธิบายยังไงเหมือนกัน ลองดูสักนิดแล้วจะรู้ว่ามันสุดยอดมาก
-
Zen Coding: A Speedy Way to Write HTML/CSS Code(Smashingmagazine)
-
Learn how to write lightnigh-fast code in 4 minutes (วิดีโอ, Nettuts)
สำหรับ IDE ตัวโปรดของผมอย่าง Netbeans IDE ก็มีปลั๊กอินสำหรับ Zen Coding เหมือนกันครับ สามารถดาวน์โหลดได้ ที่นี่ ครับ
วิธีติดตั้งก็แค่ ไปที่เมนู Tools > Options > ปุ่ม Import (ล่างซ้าย) > กด browse เลือกไฟล์ที่เราโหลดมา (.zip) > กด OK แล้วก็รีสตาร์ท NetBeans ครับ
น่าเสียดายที่ Zen Coding สำหรับ NetBeans นั้น ไม่ได้รองรับ Expand Abbreviation (ฟีเจอร์เทพๆที่เห็นในวิดีโอนั่นแหละครับ) แต่ก็ทดแทนด้วย Code Templates ที่เยอะมากๆ ซึ่งจะช่วยให้เราใช้งานร่วมกันฟีเจอร์ auto-complete ได้อย่างสนุกสนานยิ่งขึ้น .. สามารถเข้าไปดู code templates ได้ที่ Options > Editor > Code Templates > เลือก Language เป็น HTML ครับ
ก็จะพบกับลิสต์ยาวเหยียดของ code template ที่มีให้ครับ ผมเองก็จำไม่หมดหรอกครับ .. วิธีใช้งานก็แสนง่าย แค่พิมพ์โค้ดในส่วน Abbreviation เจ้าตัว NetBeans ก็จะแปลงเป็น Expanded Text ให้อย่างรวดเร็ว ตัวอย่างผมพิมพ์ html:4s หมายถึง ต้องการสร้างไฟล์ html 4 ที่ประกาศ doctype แบบ strict ..
แล้วพอกด tab Netbeans ก็จะแปลงโค้ดให้เราทันที พร้อม cursor ก็ไปอยู่ในตำแหน่งที่อำนวยความสะดวกให้เราสุดๆ (กด tab เลื่อนๆไปเรื่อยๆได้)
หรืออย่าง link:css
กด tab ปุ๊ป .. พร้อมพิมพ์ชื่อไฟล์ได้ทันที 
เท่าที่ดู มีแท็ก html ให้เกือบครบ รวมถึง html5 ด้วย ถ้าจำได้เยอะๆ หรือฝึกใช้คล่อง คิดว่าจะทำให้เขียนโค้ด html ได้เร็วขึ้นมากๆเลยล่ะครับ 