VueJS คืออะไร
Vue.js เป็นเฟรมเวิร์ก (framework) ของ JavaScript ที่ใช้สำหรับพัฒนาแอปพลิเคชันเว็บแอปพลิเคชันแบบ Single Page Application (SPA) ซึ่งเป็นแอปพลิเคชันที่โหลดข้อมูลและทรัพยากรเพียงครั้งเดียวและมีการอัพเดตหน้าเว็บโดยไม่ต้องโหลดหน้าใหม่ เป็นการจัดการข้อมูลและสถานะของแอปพลิเคชันได้อย่างมีประสิทธิภาพ
Vue.js ถูกสร้างขึ้นโดย Evan You และเปิดตัวเป็นครั้งแรกในปี ค.ศ. 2014 ซึ่งมีการพัฒนาและการใช้งานที่แพร่หลายขึ้นอย่างรวดเร็ว เป็นเฟรมเวิร์กที่มีขนาดเล็กและเรียนรู้ได้ง่าย แต่ก็มีความสามารถที่มีประสิทธิภาพในการจัดการสถานะและการเชื่อมโยงข้อมูล นอกจากนี้ Vue.js ยังมีคอมโพเนนต์ที่สามารถนำมาใช้เพิ่มเติมได้ตามความต้องการของโปรเจกต์ ทำให้มันเป็นเครื่องมือที่สะดวกและมีความยืดหยุ่นสำหรับนักพัฒนาในการสร้างแอปพลิเคชันเว็บที่ทันสมัยและปรับปรุงได้ง่าย
เริ่มต้นใช้งาน VueJS
ก่อนเริ่มศึกษาหรือใช้งาน VueJS เราต้องมีความเข้าใจเกี่ยวกับการใช้งานคำสั่ง command line
เบื้องต้น และรู้จักภาษา JavaScript พอสมควร
เตรียมเครื่องมือต่างๆ ก่อนสร้าง Vue Application
- ติดตั้ง NodeJS เวอร์ชั่น 18.3 เป็นต้นไป เนื้อหาต่อไปนี้จะเกี่ยวกับ vue เวอร์ชั่น 3 เป็นต้นไป
- โฟลเดอร์สำหรับพัฒนาโปรเจกต์ ในที่นี้ เราใช้เป็น C:/vuejsdev
- ใช้ VSCode ในการเขียนโปรแกรม และติดตั้ง Vue extension สำหรับ VSCode
สร้าง Vue Application
ให้ใช้คำสั่งดังนี้ผ่าน command line เพื่อสร้าง vue application
npm create vue@latest
ณ เวลาที่เขียนบทความจะเป็น vue เวอร์ชั่น 3
จากนั้นทำตามขั้นตอนบนหน้าจอ ส่วนใหญ่จะกด Enter ผ่านตลอด
เมื่อขึ้นข้อความ Done จะเป็นการแนะนำการเริ่มการทำงานของ server
โดยเขาจะแนะนำให้เข้าไปยัง path ของโฟลเดอร์โปรเจกต์ ซึ่งเราใช้เป็น vue-project
แล้วทำการติดตั้ง dependencies และเริ่มทำงานของ server
cd <your-project-name> npm install npm run dev
เมื่อ server สำหรับพัฒนาทำงาน ก็จะแจ้ง url ให้เรานำไปเปิดผ่านบราเซอร์
ในรูปตัวอย่างคือ http://localhost:5173/
ข้างต้นคือ เราได้ทำการติดตั้งส่วนต่าง และเริ่มต้นโปรเจกต์เรียบร้อยแล้ว
ให้เราเปิดโปรแกรม VSCode สำหรับแก้ไขหรือเขียนโปรแกรมต่อไป
อย่าลืมติดตั้ง vue - official extension สำหรับ VSCode สำหรับใช้งาน
อ่านต่อที่บทความ
เนื้อหาที่เกี่ยวข้อง