0Pricing
Vue Academy icon

Vue Academy

HTMLFrontendWebBeginner

สร้างส่วนติดต่อผู้ใช้ที่ interactive และ efficient ด้วย Vue.js ผ่าน Vue Academy

🤖 ขับเคลื่อนด้วย AI📚 คอร์ส 42👥 ผู้เรียน 100,000+ คน⭐ คะแนน 4.9
ภาพรวมคอร์ส

Vue.js: The Progressive Framework for Building Real UIs

Vue.js เป็น progressive JavaScript framework ที่ออกแบบมาสำหรับการสร้างส่วนติดต่อผู้ใช้ที่ขับเคลื่อนด้วย component — ตั้งแต่ widget เดียว interactive ที่ฝังอยู่ในหน้าเดิมไปจนถึงแอปพลิเคชันที่ render ทั้งหมดบนเซิร์ฟเวอร์ด้วย Nuxt Composition API ของ Vue ระบบ reactivity ที่เจาะจง และการรองรับ TypeScript ระดับหนึ่งทำให้เป็นตัวเลือกที่ใช้ได้จริงสำหรับโครงการใหม่และทีมที่อพยพจากส่วนหน้าที่เก่า track นี้ครอบคลุม Vue 3 ตั้งแต่ต้นจนถึงท้าย จากไวยากรณ์ template ไปจนถึงการ deploy ในสภาพแวดล้อมจริง

สิ่งที่คุณจะเรียนรู้

คุณจะทำงานผ่าน Composition API และไวยากรณ์ script setup Vue directives computed properties และพื้นฐาน reactivity Track นี้ครอบคลุมการสื่อสารระหว่าง component slots provide/inject และ composables สำหรับตรรกะที่ใช้ร่วมกัน คุณจะจัดการสถานะของแอปพลิเคชันด้วย Pinia และ Vuex จัดการ routing ด้วย Vue Router รวมถึง pattern ขั้นสูง ตรวจสอบความถูกต้องของแบบฟอร์ม และใช้ REST APIs พร้อมข้อมูลแบบ real-time ผ่าน WebSockets หลักสูตรที่ต่อมาครอบคลุม TypeScript integration internationalization Storybook testing ด้วย Vitest การ optimize performance server-side rendering ด้วย Nuxt 3 GraphQL ด้วย Apollo Progressive Web Apps และ Vue security practices

เส้นทางการเรียนรู้

หลักสูตรสี่สิบสองหลักสูตรขยายตั้งแต่ A1 ถึง C1 หลักสูตร A1 และ A2 สร้างพื้นฐาน Vue CLI ไวยากรณ์ template data binding directives แบบฟอร์ม และพื้นฐาน component หลักสูตร B1 พัฒนา ecosystem ทั้งหมด: lifecycle hooks transitions Pinia Vuex Vue Router TypeScript i18n และ async data B2 เพิ่มระดับความยากด้วย server-side rendering ผ่าน Nuxt 3 GraphQL WebSockets component testing render functions PWA support และการเผยแพร่ component library C1 capstone courses ตัดสินใจเรื่อง micro-frontend architecture pattern Composition API ขั้นสูง SSR streaming ด้วย Suspense Vue performance ในมาตราส่วนใหญ่ และแอปพลิเคชัน full-stack ที่สร้างด้วย Fastify และ authentication

วิธีการทำงาน

แต่ละหลักสูตรแบ่งออกเป็นบทเรียนสั้น ๆ ที่มีเป้าหมายชัดเจนซึ่งคุณทำให้เสร็จสิ้นในตัวแก้ไขโค้ด built-in ที่มี real-time feedback AI tutor พร้อมใช้งานเมื่อคุณติดขัด เพื่อคุณสามารถดำเนินการผ่านแบบฝึกหัด syntax ความท้าทาย component และปัญหา architecture ได้ตามความเร็วของคุณเองโดยไม่ต้องออกจากแอปพลิเคชัน

เริ่มเรียนรู้ →

วิธีการเรียนรู้ของคุณ

🎯
บทเรียนแบบโต้ตอบ
แบบฝึกหัดการเขียนโค้ดโดยตรงพร้อมข้อเสนอแนะแบบเรียลไทม์
🤖
ติวเตอร์ AI
ได้รับความช่วยเหลือแบบทันทีจาก AI ของเราเมื่อคุณติดขัด
💻
ตัวแก้ไขในตัว
เขียนและรันโค้ดโดยตรงในเบราว์เซอร์ของคุณ
🏆
ใบรับรอง
ได้รับใบรับรองเมื่อคุณเสร็จสิ้นหลักสูตร
หลักสูตร

42 หลักสูตร

ทุกหลักสูตรในเส้นทางการเรียนรู้ Vue Academy

01

บทนำสู่ Vue.js

A13 บทเรียน

เริ่มต้นใช้งาน Vue.js ทำความเข้าใจว่าคืออะไร ตั้งค่าสภาพแวดล้อม และสร้างแอปพลิเคชันรีแอกทีฟแรกของคุณ

02

ทำความเข้าใจ Vue CLI และโครงสร้างโครงการ

A13 บทเรียนPRO

เรียนรู้การสร้างโครงร่างโครงการ Vue ด้วย CLI และทำความเข้าใจโครงสร้างไฟล์กับเครื่องมือที่สร้างขึ้น

03

ไวยากรณ์เทมเพลตและการผูกข้อมูล

A13 บทเรียนPRO

เรียนรู้ไวยากรณ์เทมเพลตเชิงประกาศของ Vue ทั้งการแทรกข้อความ คำสั่ง เงื่อนไข ลูป และการผูกข้อมูล

04

พื้นฐาน Composition API ของ Vue 3

A24 บทเรียนPRO

เปลี่ยนจาก Options API มาใช้ Composition API ของ Vue 3 ด้วย setup(), ref และ reactive เพื่อพัฒนา Vue สมัยใหม่

05

ไวยากรณ์ Script Setup ของ Vue 3

A24 บทเรียนPRO

เขียนคอมโพเนนต์ที่สะอาดและใช้งานสะดวกยิ่งขึ้นด้วยไวยากรณ์แบบย่อ ใน Vue 3

06

เจาะลึกคำสั่งของ Vue

A24 บทเรียนPRO

เรียนรู้คำสั่งในตัวของ Vue ทุกคำสั่ง และฝึกเขียนคำสั่งแบบกำหนดเอง

07

แบบฟอร์มและการตรวจสอบความถูกต้องใน Vue

A24 บทเรียนPRO

สร้างแบบฟอร์มที่แข็งแกร่งด้วย v-model การตรวจสอบแบบเนทีฟ และไลบรารี VeeValidate

08

พื้นฐานคอมโพเนนต์และการสื่อสาร

A23 บทเรียนPRO

สร้างคอมโพเนนต์ Vue ที่นำกลับมาใช้ใหม่ได้ และเชื่อมต่อกันด้วยพร็อพ อีเวนต์แบบกำหนดเอง และสล็อต

09

รีแอกทิวิตีและคุณสมบัติคำนวณ

A23 บทเรียนPRO

ทำความเข้าใจระบบรีแอกทิวิตีของ Vue และใช้คุณสมบัติคำนวณกับตัวเฝ้าดูได้อย่างมีประสิทธิภาพ

10

วงจรชีวิตคอมโพเนนต์ของ Vue

B14 บทเรียนPRO

เรียนรู้ฮุกวงจรชีวิตของคอมโพเนนต์ Vue 3 และทำความเข้าใจว่าแต่ละช่วงทำงานเมื่อใด

11

การเปลี่ยนผ่านและภาพเคลื่อนไหวใน Vue

B14 บทเรียนPRO

เพิ่มการเปลี่ยนผ่านเข้าและออกที่ราบรื่น รวมถึงภาพเคลื่อนไหวของรายการด้วย และ ของ Vue

12

สล็อตขั้นสูงของ Vue

B14 บทเรียนPRO

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

13

Provide และ Inject

B14 บทเรียนPRO

แชร์ข้อมูลข้ามคอมโพเนนต์ที่ซ้อนกันลึกโดยไม่ต้องส่งพร็อพผ่านทุกชั้น ด้วยกลไก provide/inject ของ Vue

14

Composables ของ Vue 3

B14 บทเรียนPRO

เขียนตรรกะแบบมีสถานะที่นำกลับมาใช้ใหม่ได้ในรูปของ composables ซึ่งเป็นรูปแบบหลักในการนำโค้ดกลับมาใช้ใหม่ใน Vue 3

15

การจัดการข้อผิดพลาดใน Vue

B14 บทเรียนPRO

สร้างแอปพลิเคชัน Vue ที่ทนทานด้วยขอบเขตข้อผิดพลาดที่เหมาะสม UI สำรอง และการจัดการข้อผิดพลาดทั่วทั้งระบบ

16

การจัดการสถานะด้วย Pinia

B14 บทเรียนPRO

แทนที่ Vuex ด้วย Pinia ไลบรารีจัดการสถานะอย่างเป็นทางการของ Vue 3 ที่เรียบง่ายกว่าและออกแบบโดยให้ TypeScript เป็นหลัก

17

TypeScript กับ Vue 3

B14 บทเรียนPRO

เขียนคอมโพเนนต์ Vue 3 ที่ปลอดภัยด้านชนิดข้อมูลอย่างสมบูรณ์ด้วยพร็อพ อีเวนต์ และ composables ที่กำหนดชนิดข้อมูลโดยใช้ TypeScript

18

การทำให้ Vue รองรับหลายภาษา (i18n)

B14 บทเรียนPRO

สร้างแอป Vue หลายภาษาด้วย vue-i18n v9 การสลับภาษา และการจัดรูปพหูพจน์อย่างเหมาะสม

19

การผสาน Vue กับ Storybook

B14 บทเรียนPRO

จัดทำเอกสารและพัฒนาคอมโพเนนต์ Vue แบบแยกส่วนด้วย Storybook พร้อมเขียนเรื่องราวและตัวควบคุมแบบโต้ตอบ

20

การกำหนดเส้นทางด้วย Vue Router

B13 บทเรียนPRO

เพิ่มการนำทางฝั่งไคลเอ็นต์ให้แอป Vue ด้วย Vue Router ทั้งเส้นทาง พารามิเตอร์ และตัวป้องกันการนำทาง

21

การจัดการสถานะด้วย Vuex

B13 บทเรียนPRO

จัดการสถานะแอปพลิเคชันที่ใช้ร่วมกันด้วย Vuex ทั้งสถานะ การกลายพันธุ์ การกระทำ ตัวรับค่า และโมดูล

22

การจัดการ API และข้อมูลแบบไม่พร้อมกัน

B13 บทเรียนPRO

ดึงและจัดการข้อมูลระยะไกลในแอป Vue ด้วย Axios ฮุกวงจรชีวิต และการจัดการข้อผิดพลาดที่แข็งแกร่ง

23

การนำไปใช้งานและดูแลแอป Vue

B13 บทเรียนPRO

สร้าง นำไปใช้งาน และดูแลแอปพลิเคชัน Vue ในสภาพแวดล้อมจริงด้วยแพลตฟอร์มโฮสติ้งและการตรวจสอบระบบ

24

ระบบนิเวศ Vue และก้าวต่อไป

B14 บทเรียนPRO

สำรวจเครื่องมือ Vue ที่ล้ำสมัย โหมด Vapor และรูปแบบใหม่ ๆ ที่กำลังกำหนดอนาคตของการพัฒนา Vue

25

รูปแบบขั้นสูงของ Vue Router

B24 บทเรียนPRO

เรียนรู้ความสามารถขั้นสูงของ Vue Router ทั้งเมทาของเส้นทาง พฤติกรรมการเลื่อน การเปลี่ยนผ่าน และการนำทางผ่านโค้ด

26

การเรนเดอร์ฝั่งเซิร์ฟเวอร์ด้วย Nuxt 3

B24 บทเรียนPRO

สร้างแอปพลิเคชัน Vue แบบครบสแตกด้วยการกำหนดเส้นทางตามไฟล์ เส้นทางเซิร์ฟเวอร์ และความสามารถ SSR/SSG ของ Nuxt 3

27

Vue กับ GraphQL และ Apollo

B24 บทเรียนPRO

ผสาน GraphQL เข้ากับแอป Vue ด้วย Apollo Client สำหรับการสืบค้น การกลายพันธุ์ และการสมัครรับข้อมูลแบบเรียลไทม์

28

แอปแบบเรียลไทม์ด้วย Vue และ WebSockets

B24 บทเรียนPRO

สร้างแอป Vue ที่อัปเดตข้อมูลสดด้วย WebSockets และ Socket.io สำหรับแชต แดชบอร์ด และการทำงานร่วมกัน

29

การทดสอบคอมโพเนนต์ด้วย Vitest

B24 บทเรียนPRO

ทดสอบคอมโพเนนต์ Vue อย่างน่าเชื่อถือด้วย Vitest และ Vue Test Utils พร้อมการจำลองและรายงานความครอบคลุม

30

การเพิ่มประสิทธิภาพใน Vue

B23 บทเรียนPRO

เร่งความเร็วแอป Vue ด้วยการโหลดเมื่อจำเป็น การแบ่งโค้ด การจดจำผลลัพธ์ และการวิเคราะห์คอขวด

31

การทดสอบแอปพลิเคชัน Vue

B23 บทเรียนPRO

ทดสอบแอป Vue ด้วยการทดสอบหน่วยโดยใช้ Vue Test Utils และการทดสอบตั้งแต่ต้นจนจบเพื่อให้ครอบคลุมอย่างสมบูรณ์

32

รูปแบบขั้นสูงและแนวทางปฏิบัติที่ดีที่สุด

B23 บทเรียนPRO

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

33

ฟังก์ชันเรนเดอร์และ JSX ของ Vue

B24 บทเรียนPRO

ก้าวข้ามเทมเพลตด้วยฟังก์ชันเรนเดอร์ h() ของ Vue และ JSX เพื่อสร้างคอมโพเนนต์แบบไดนามิกผ่านโค้ด

34

เว็บแอปแบบก้าวหน้าด้วย Vue

B24 บทเรียนPRO

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

35

แนวทางปฏิบัติที่ดีที่สุดด้านความปลอดภัยของ Vue

B24 บทเรียนPRO

รักษาความปลอดภัยให้แอป Vue จาก XSS, CSRF และช่องโหว่เว็บอื่น ๆ ด้วยรูปแบบการป้องกันที่ใช้ได้จริง

36

การเผยแพร่ไลบรารีคอมโพเนนต์ Vue

B24 บทเรียนPRO

สร้าง จัดทำเอกสาร และเผยแพร่ไลบรารีคอมโพเนนต์ Vue ที่นำกลับมาใช้ใหม่ได้ไปยัง npm ด้วยโหมดไลบรารีของ Vite

37

การพัฒนาปลั๊กอิน Vue 3

B24 บทเรียนPRO

สร้างปลั๊กอิน Vue ที่ติดตั้งได้ ซึ่งเพิ่มคอมโพเนนต์ คำสั่ง composables และการตั้งค่าทั่วทั้งแอป

38

ไมโครฟรอนต์เอนด์ด้วย Vue

C14 บทเรียนPRO

ออกแบบแอปพลิเคชัน Vue ขนาดใหญ่ให้เป็นไมโครฟรอนต์เอนด์อิสระด้วย Module Federation

39

รูปแบบ Composition API ขั้นสูง

C14 บทเรียนPRO

เรียนรู้รูปแบบรีแอกทิวิตีขั้นสูง เครื่องจักรสถานะ และโรงงาน composable สำหรับแอป Vue ที่ซับซ้อน

40

ประสิทธิภาพขั้นสูงของ Vue

C14 บทเรียนPRO

วิเคราะห์และเพิ่มประสิทธิภาพแอป Vue ด้วย v-memo การโหลดเมื่อจำเป็น และการปรับแต่งระบบรีแอกทีฟ

41

การสตรีม SSR และ Suspense ของ Vue

C14 บทเรียนPRO

ใช้งาน SSR แบบสตรีมและ Vue Suspense เพื่อโหลดหน้าเว็บแบบค่อยเป็นค่อยไปและปรับปรุง Core Web Vitals

42

Vue แบบครบสแตกด้วย Fastify และการยืนยันตัวตน

C14 บทเรียนPRO

สร้างแอปพลิเคชันแบบครบสแตกพร้อมใช้งานจริง ด้วยส่วนหน้า Vue 3 ส่วนหลัง Fastify และการยืนยันตัวตน JWT

คำถามที่พบบ่อย

คำถามที่พบบ่อย

หลักสูตร Vue Academy ฟรีหรือไม่

ใช่ คุณสามารถเริ่มหลักสูตร Vue Academy ได้ฟรีและเสร็จสิ้นบทเรียนแบบโต้ตอบโดยไม่มีค่าใช้จ่าย การสมัครสมาชิก PRO ที่เป็นทางเลือกจะปลดล็อกเครื่องมือ AI ขั้นสูงและใบรับรองที่แชร์ได้

ฉันต้องมีประสบการณ์มาก่อนหรือไม่ในการเรียนรู้ HTML

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

ฉันจะเรียนรู้ HTML บน CoddyKit ได้อย่างไร

คุณเรียนรู้โดยการลงมือทำ บทเรียนสั้น ๆ แบบโต้ตอบจับคู่คำอธิบายที่ชัดเจนกับแบบฝึกหัดการเขียนโค้ดที่ทำงานในเวลาจริง และติวเตอร์ AI ที่ทำงาน 24/7 ให้ความช่วยเหลือแบบบุคคลเมื่อคุณติดขัด

ฉันได้รับใบรับรองสำหรับการเสร็จสิ้น Vue Academy หรือไม่

ใช่ ผู้เรียน PRO สามารถสอบและได้รับใบรับรองการเสร็จสิ้นที่แชร์ได้พร้อมรหัสที่สามารถตรวจสอบได้สำหรับหลักสูตร Vue Academy

ฉันสามารถเรียนรู้ HTML บนโทรศัพท์ของฉันได้หรือไม่

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

เริ่มเรียน Vue Academy ตอนนี้

เข้าร่วมกับผู้เรียนนับพันคนที่กำลังเรียนรู้การเขียนโปรแกรมผ่านบทเรียนที่ขับเคลื่อนด้วย AI

เริ่มฟรี →ดูคอร์สทั้งหมด