这门课解决什么问题

很多想转行的朋友一听到"Vue3训练营"，就觉得是教敲代码的。但飞宝课想帮你理清一个现实：在企业里，前端开发不是照着文档敲模板，而是需要能独立拆解需求、搭出可运行的业务模块。这门课解决的核心问题是：帮你把零散的Vue3语法串成企业级应用的构建逻辑，让你面对真实项目时，不再只会写页面，而是能真正把功能做出来、跑通。

适合什么基础与建议先看哪几块

适合没有编程基础，或者仅有少量前端经验的朋友。如果你是完全的新手，建议跳过Introduction里的框架对比，直接进入Vue Fundamentals的基础模块。重点看"Getting Started"和"Vue Dev Tools"这两块，先让浏览器跑起来，熟悉开发工具，再顺着"Working with Data"和"Methods、Directives"的逻辑往下走。资料里的配套代码包是跟着视频节奏走的，建议拿STARTER版本动手试，别光看。

学完能独立做什么与资料怎么配合练习

学完你不再需要人手把手带着写页面，能够独立完成中小型业务模块的开发与调试。资料怎么用比看资料更重要：视频讲概念，代码包给你骨架。遇到"Two-way data binding"或"Listening to Events"这类核心机制，不要只看3分钟的视频，一定要去下载对应的STARTER代码，跟着把事件监听和数据绑定的手写逻辑补全，然后再对照COMPLETE版本自己加功能。动手改代码，才是踩坑和进步的必经之路。

整套课程从组件化思维出发，一步步带你建立从页面搭建到状态管理再到调试排错的完整开发习惯。资料包里的代码不是只读的教学示例，而是你后续接真实项目时的起点。建议边学边把视频里的知识点对应到代码里，遇到卡壳的地方不要跳过，那才是真正帮你建立编程直觉的时刻。

课程目录

课程目录348 集
  • 01 - Introduction.mp4
  • 001 Course Outline.mp4 81.18M
  • 002 Join Our Online Classroom!.mp4 152.35M
  • 004 Vue vs React vs Angular.mp4 338.25M
  • 005 Composition vs. Options API.mp4 4.69M
  • 006 Vue-Course-Guidebook.pdf 185.83kb
  • 006 ZTM-Vue-Course-Code.zip 6.95M
  • 02 - Vue Fundamentals.mp4
  • 001 Getting Started.mp4 45.39M
  • 001 section-2-1-COMPLETE.zip 0.71kb
  • 001 section-2-1-STARTER.zip 0.64kb
  • 002 Vue Dev Tools.mp4 19.07M
  • 003 Working with Data.mp4 43.67M
  • 004 Multiple Vue Instances.mp4 24.61M
  • 005 Accessing the Instance Data.mp4 22.10M
  • 006 Methods.mp4 18.10M
  • 007 Directives.mp4 18.01M
  • 008 Two-way data binding.mp4 30.07M
  • 009 Binding Attributes.mp4 12.07M
  • 009 section-2-9-COMPLETE.zip 1.06kb
  • 010 Outputting Raw HTML.mp4 21.53M
  • 011 Listening to Events.mp4 49.29M
  • 011 section-2-11-COMPLETE.zip 1.22kb
  • 012 Passing on Data with Events.mp4 9.18M
  • 013 Event Modifiers.mp4 18.90M
  • 014 Keyboard Events and Modifiers.mp4 24.81M
  • 015 v-model Modifiers.mp4 52.11M
  • 016 Computed Properties.mp4 60.40M
  • 017 section-2-17-COMPLETE.zip 1.41kb
  • 017 Watchers.mp4 9.03M
  • 018 Binding Classes.mp4 32.27M
  • 018 section-2-18-STARTER.zip 0.93kb
  • 019 Binding Styles.mp4 21.33M
  • 019 section-2-19-COMPLETE.zip 1.22kb
  • 020 Conditional Rendering.mp4 41.49M
  • 020 section-2-20-STARTER.zip 0.71kb
  • 021 section-2-21-COMPLETE.zip 0.89kb
  • 021 The v-show Directive.mp4 15.74M
  • 022 List Rendering.mp4 51.96M
  • 022 section-2-22-STARTER.zip 0.82kb
  • 023 section-2-23-COMPLETE.zip 1.21kb
  • 023 section-2-23-STARTER.zip 1.11kb
  • 023 Understanding the role of the key attribute.mp4 51.74M
  • 03 - Project 1 Perspective Playground.mp4
  • 001 Creating a Perspective Playground.mp4 57.55M
  • 001 section-3-1-STARTER.zip 1.52kb
  • 002 Copying to the Clipboard.mp4 38.21M
  • 002 section-3-2-COMPLETE.zip 1.77kb
  • 04 - Vue Beyond the Fundamentals.mp4
  • 001 Mounting the Vue Instance.mp4 9.65M
  • 001 section-4-1-STARTER.zip 0.76kb
  • 002 Understanding Lifecycle Hooks.mp4 9.95M
  • 003 section-4-3-COMPLETE.zip 0.92kb
  • 003 Using Lifecycle Hooks.mp4 56.53M
  • 004 Virtual DOM.mp4 28.01M
  • 005 Understanding Reactivity with Proxies.mp4 37.89M
  • 006 The Vue Compiler.mp4 65.22M
  • 007 Introduction to Components.mp4 35.89M
  • 007 section-4-7-COMPLETE.zip 0.88kb
  • 05 - Vue Developer Environment.mp4
  • 001 Overview.mp4 3.89M
  • 003 Introduction to Vite.mp4 11.93M
  • 004 Exploring Vite.mp4 29.32M
  • 005 Understanding SASS.mp4 38.69M
  • 006 PostCSS.mp4 18.92M
  • 007 Installing ESLint.mp4 21.80M
  • 008 Configuring ESLint.mp4 55.43M
  • 008 section-5-7-COMPLETE.zip 7.24kb
  • 009 section-5-8-COMPLETE.zip 1.64kb
  • 009 webpack-example.zip 1.64kb
  • 009 Webpack.mp4 34.64M
  • 010 Conclusion.mp4 1.13M
  • 06 - Advanced Vue Components.mp4
  • 001 Scaffolding a Vue Project.mp4 39.85M
  • 002 Sidebar Understanding Servers.mp4 9.68M
  • 003 Reviewing the Files.mp4 48.16M
  • 004 Creating Components.mp4 13.12M
  • 005 Child Components.mp4 39.41M
  • 006 Component Styles.mp4 44.83M
  • 007 Using SASS in Components.mp4 4.49M
  • 008 Communicating Between Components.mp4 4.31M
  • 009 Props.mp4 22.08M
  • 010 The Limitations of Props.mp4 15.92M
  • 011 Emitting Events.mp4 40.36M
  • 012 Validating Props.mp4 57.49M
  • 013 Callback Functions.mp4 15.58M
  • 013 section-6-13-COMPLETE.zip 12.88kb
  • 014 Inserting content with slots.mp4 33.87M
  • 015 Named Slots.mp4 58.18M
  • 015 section-6-15-COMPLETE.zip 4.87kb
  • 016 Dynamic Components.mp4 57.45M
  • 016 section-6-16-COMPLETE.zip 11.76kb
  • 07 - Transitions & Animations.mp4
  • 001 Animating with CSS Transitions.mp4 45.50M
  • 001 section-7-1-STARTER.zip 4.79kb
  • 002 Fine-tuning Transitions.mp4 31.43M
  • 003 Animating with CSS Animations.mp4 28.62M
  • 004 Animating with JavaScript.mp4 34.30M
  • 005 JavaScript Zoom Animation.mp4 48.19M
  • 006 CSS and JavaScript Transitions.mp4 13.10M
  • 007 Animating a List.mp4 42.45M
  • 008 Fixing the Animation.mp4 11.61M
  • 009 section-7-9-COMPLETE.zip 5.56kb
  • 009 Transition CSS Class Names.mp4 35.27M
  • 08 - Project 2 Vue Quiz App.mp4
  • 001 section-8-1-STARTER.zip 1.60kb
  • 001 Setting up the Quiz Application.mp4 19.32M
  • 002 Rendering the Questions.mp4 102.31M
  • 003 Moving between Questions.mp4 60.40M
  • 004 Finishing Touches.mp4 71.46M
  • 004 section-8-4-COMPLETE.zip 6.28kb
  • 005 Exercise Imposter Syndrome.mp4 53.79M
  • 09 - Master Project Introduction to Pinia.mp4
  • 001 The Next Step.mp4 10.65M
  • 002 Creating a New Project.mp4 10.24M
  • 003 Reviewing the Files.mp4 32.95M
  • 004 Formatting with ESLint and Prettier.mp4 41.04M
  • 005 Adding the Template.mp4 88.93M
  • 005 music-template.zip 187.54kb
  • 006 What is Tailwind.mp4 21.79M
  • 007 Installing Tailwind.mp4 65.42M
  • 008 Practicing with Tailwind.mp4 44.48M
  • 009 Loading Assets.mp4 26.52M
  • 010 Understanding State.mp4 19.26M
  • 011 Reviewing the Pinia Configuration.mp4 21.60M
  • 012 Splitting the Template into Components.mp4 53.54M
  • 014 Working with State.mp4 55.30M
  • 015 Alternative Mapping Functions.mp4 14.52M
  • 016 Understanding Getters.mp4 2.50M
  • 017 Using Getters.mp4 15.36M
  • 018 Closing the Modal.mp4 20.34M
  • 019 Aliases.mp4 35.37M
  • 020 Adding Tabs.mp4 58.42M
  • 020 music-9-22-COMPLETED.zip 308.20kb
  • 10 - Master Project Form Validation.mp4
  • 001 Setting up Form Validation.mp4 13.48M
  • 002 Registering a Plugin.mp4 22.11M
  • 003 Validation Components.mp4 46.08M
  • 004 Defining Rules.mp4 15.25M
  • 005 Applying Rules.mp4 48.34M
  • 006 Additional Rules.mp4 68.75M
  • 007 Validating Emails.mp4 31.91M
  • 008 Validating Numbers.mp4 28.31M
  • 009 Validating Passwords.mp4 47.13M
  • 010 Dropdown and Checkbox Fields.mp4 71.95M
  • 011 music-10-11-COMPLETED.zip 498.85kb
  • 011 Validating the Form.mp4 19.23M
  • 012 section-10-12-COMPLETE.zip 5.03kb
  • 012 section-10-12-STARTER.zip 5.01kb
  • 012 Sidebar Slot Properties.mp4 28.15M
  • 013 Rendering Multiple Error Messages.mp4 42.26M
  • 014 Default Values.mp4 9.62M
  • 015 Custom Error Messages.mp4 88.46M
  • 016 Validation Triggers.mp4 19.82M
  • 017 Showing Alerts.mp4 74.35M
  • 018 music-10-18-COMPLETED.zip 311.89kb
  • 018 Setting up the Login Form.mp4 237.98M
  • 11 - Master Project Authentication.mp4
  • 001 Understanding Authentication.mp4 28.65M
  • 002 Reviewing the Rules.mp4 15.65M
  • 003 Setting up the Firebase SDK.mp4 52.97M
  • 004 User Registration.mp4 57.27M
  • 005 Handling the Response.mp4 26.06M
  • 006 Exporting Services.mp4 35.01M
  • 007 Storing the User Form Data.mp4 54.05M
  • 009 Understanding Authentication.mp4 17.21M
  • 010 Logging the user in after Signup.mp4 83.71M
  • 011 Understanding Actions.mp4 5.88M
  • 012 Using Actions.mp4 64.57M
  • 013 Connecting the User with their Data.mp4 61.66M
  • 014 Initializing Firebase First.mp4 16.73M
  • 015 Persisting the User Authentication.mp4 30.65M
  • 016 Setting up the Login.mp4 37.92M
  • 017 Signing Out.mp4 136.48M
  • 018 music-11-17-COMPLETED.zip 312.34kb
  • 018 Sidebar JSON Web Tokens.mp4 58.29M
  • 12 - Master Project Routing.mp4
  • 001 Understanding Routing.mp4 10.69M
  • 002 Reviewing the Router Configuration.mp4 17.10M
  • 003 Creating Routes.mp4 73.64M
  • 004 History Mode.mp4 118.72M
  • 005 Navigating with Links.mp4 34.45M
  • 006 Custom Links.mp4 62.80M
  • 007 Tailwind Styles for Active Links.mp4 70.86M
  • 008 Naming Routes.mp4 25.85M
  • 010 Route Alias.mp4 10.84M
  • 011 Guarding Routes.mp4 42.41M
  • 012 Route Specific Guards.mp4 33.37M
  • 013 Guarding Authentication Only Routes.mp4 11.02M
  • 014 Redirecting after Logging Out.mp4 26.48M
  • 015 music-12-15-COMPLETED.zip 313.96kb
  • 015 Route Meta Fields.mp4 32.64M
  • 13 - Master Project Uploading Files.mp4
  • 001 Preparing the Upload Component.mp4 63.62M
  • 002 Handling Drag and Drop Events.mp4 71.17M
  • 003 Handling the File.mp4 59.57M
  • 005 Uploading Files with Firebase.mp4 39.79M
  • 006 Firebase Rules and Validation.mp4 32.54M
  • 007 Adding the Progress Bar.mp4 57.29M
  • 008 Making the Progress Bar Dynamic.mp4 17.91M
  • 009 Improving the Progress Bar.mp4 20.67M
  • 010 Handling Errors and Successful Uploads.mp4 60.46M
  • 011 Storing the File Data in the Database.mp4 86.54M
  • 012 Firebase References and Snapshots.mp4 10.25M
  • 013 Fallback Upload.mp4 43.52M
  • 014 Canceling Uploads.mp4 28.97M
  • 015 Cancelling Uploads with Refs.mp4 38.04M
  • 015 music-13-14-COMPLETED.zip 513.83kb
  • 016 One more thing about References.mp4 14.38M
  • 016 section-13-16-STARTER.zip 0.52kb
  • 017 Querying the Database.mp4 33.50M
  • 018 Storing the List of Songs.mp4 24.91M
  • 019 Displaying the List of Songs.mp4 19.16M
  • 020 Prop Validation.mp4 12.10M
  • 021 Toggling the Form.mp4 13.91M
  • 022 Validating the Song Form.mp4 64.50M
  • 023 Editing a Song.mp4 106.69M
  • 024 Deleting a Song from the StorageDatabase.mp4 82.16M
  • 025 Updating the list of songs after an Upload.mp4 64.25M
  • 026 music-13-26-COMPLETED.zip 316.75kb
  • 026 Router Leave Guards.mp4 90.11M
  • 14 - Master Project Playing Music.mp4
  • 001 Creating the Home Page.mp4 84.46M
  • 002 Checking the Scroll Position.mp4 62.06M
  • 003 Infinite Scrolling.mp4 45.63M
  • 004 Path Parameters.mp4 40.55M
  • 005 Creating the Song Template.mp4 99.83M
  • 006 Validating the Comment.mp4 37.18M
  • 007 Prepping the Form.mp4 43.17M
  • 008 Finalizing the Comment Form.mp4 89.78M
  • 009 Displaying the Comments.mp4 48.08M
  • 010 Updating the Comments List.mp4 60.95M
  • 011 Query Parameters.mp4 31.26M
  • 012 Detecting Query Parameters.mp4 26.19M
  • 013 Updating the Comment Count.mp4 54.69M
  • 014 Storing the song in the State.mp4 59.80M
  • 015 Playing Audio.mp4 29.01M
  • 016 Toggling Audio.mp4 89.75M
  • 017 Duration and Current Position.mp4 48.74M
  • 018 Formatting the Time.mp4 15.34M
  • 019 Player Progress Bar.mp4 131.79M
  • 020 Changing the Audio Position.mp4 86.71M
  • 022 Creating links with Hash Fragments.mp4 58.48M
  • 023 music-14-22-COMPLETED.zip 321.31kb
  • 023 Route Transitions.mp4 21.28M
  • 15 - Master Project Directives.mp4
  • 001 Introduction to Directives.mp4 35.91M
  • 002 Writing our First Directive.mp4 44.26M
  • 003 Passing Values to Directives.mp4 29.58M
  • 004 Directive Modifiers.mp4 43.67M
  • 005 music-15-5-COMPLETED.zip 323.21kb
  • 005 Registering a Directive Locally.mp4 27.64M
  • 16 - Master Project Internationalization.mp4
  • 001 Introduction to i18n.mp4 39.45M
  • 002 Our First Translation.mp4 48.35M
  • 003 Formatting and Pluralization.mp4 62.14M
  • 004 Number Localizations.mp4 46.82M
  • 005 Translating HTML with Component Interpolation.mp4 43.57M
  • 006 Changing Locales.mp4 26.17M
  • 007 Exercise Translating the Rest of the App.mp4 18.70M
  • 007 music-16-7-COMPLETED.zip 323.07kb
  • 17 - Master Project PWA (Progressive Web App).mp4
  • 001 What are Progressive Web Apps.mp4 13.14M
  • 002 The Manifest File.mp4 37.48M
  • 003 Generating the Manifest File.mp4 41.19M
  • 004 Configuring the Manifest File.mp4 14.14M
  • 005 Offline Support with Service Workers.mp4 24.58M
  • 006 Understanding Caching.mp4 5.17M
  • 007 Workbox.mp4 41.09M
  • 008 Firebase Data Persistence.mp4 37.58M
  • 009 Handling Offline Uploads.mp4 54.42M
  • 009 music-17-9-COMPLETED.zip 806.51kb
  • 18 - Master Project Performance Optimizations.mp4
  • 001 Overview.mp4 8.06M
  • 002 Auto-Registering Global Components.mp4 67.18M
  • 003 Perceived Performance.mp4 62.95M
  • 004 Dynamic Route Imports.mp4 23.57M
  • 005 Progress Bar.mp4 35.05M
  • 006 Code Coverage.mp4 45.87M
  • 006 music-18-12-COMPLETED.zip 627.14kb
  • 007 music-18-7-COMPLETED.zip 854.31kb
  • 007 Rollup Visualizer.mp4 29.53M
  • 19 - Master Project Deployment + Production.mp4
  • 001 Deploying an App with Vercel.mp4 77.15M
  • 20 - Master Project Testing Your Vue App.mp4
  • 001 Introduction to Testing.mp4 32.45M
  • 002 Introduction to Vitest.mp4 7.34M
  • 003 Adding the Vitest UI.mp4 30.53M
  • 004 Writing Our First Test.mp4 44.36M
  • 005 Mounting with Vue Test Utils.mp4 19.87M
  • 006 Testing the Inner Content.mp4 16.20M
  • 007 Passing Data to Components.mp4 26.62M
  • 008 Stubbing Components.mp4 18.38M
  • 009 Avoid Boolean Assertions.mp4 6.99M
  • 010 Testing Children Components.mp4 31.13M
  • 011 Mocking Methods.mp4 36.87M
  • 012 Testing Attributes.mp4 51.04M
  • 013 Testing Pinia Actions.mp4 26.45M
  • 014 Mocking Promises.mp4 19.38M
  • 015 Testing Router Components.mp4 49.91M
  • 016 Snapshot Testing.mp4 80.12M
  • 017 E2E Testing Overview.mp4 25.02M
  • 018 music-20-18-COMPLETED.zip 881.62kb
  • 018 Writing an E2E Test.mp4 99.31M
  • 21 - Composition API.mp4
  • 001 The Composition API.mp4 21.06M
  • 002 Mixins.mp4 52.64M
  • 002 section-21-2-STARTER.zip 4.61kb
  • 003 Reactive References.mp4 36.13M
  • 003 section-21-3-STARTER.zip 11.06kb
  • 004 The Reactive Function.mp4 39.08M
  • 005 Watchers and Computed Properties.mp4 37.71M
  • 006 Lifecycle Functions.mp4 20.01M
  • 007 Props.mp4 22.67M
  • 008 Template Refs.mp4 22.60M
  • 009 Emitting Events.mp4 6.33M
  • 010 Advantages of the Composition API.mp4 76.06M
  • 010 section-21-10-COMPLETE.zip 5.77kb
  • 011 Router Hooks.mp4 55.84M
  • 011 section-21-11-STARTER.zip 10.74kb
  • 012 Pinia Hooks.mp4 11.65M
  • 012 section-21-12-COMPLETE.zip 11.00kb
  • 013 Verifying Reactivity.mp4 11.61M
  • 014 section-21-14-COMPLETE.zip 5.78kb
  • 014 The setup Attribute.mp4 23.31M
  • 22 - Component Design Patterns.mp4
  • 001 Section Overview.mp4 6.20M
  • 002 Controlled Components.mp4 119.19M
  • 002 section-22-2-STARTER.zip 5.04kb
  • 003 section-22-3-COMPLETE.zip 5.46kb
  • 003 Separation of Concerns.mp4 26.36M
  • 004 section-22-4-COMPLETE.zip 10.29kb
  • 004 section-22-4-STARTER.zip 9.92kb
  • 004 Third-Party Libraries as Controlled Components.mp4 140.89M
  • 005 section-22-5-STARTER.zip 17.00kb
  • 006 Encapsulating Scrolling.mp4 126.18M
  • 007 section-22-7-COMPLETE.zip 10.50kb
  • 007 The Teleport Component.mp4 89.14M
  • 23 - Where To Go From Here.mp4
  • 001 Thank You!.mp4 7.63M
  • 24 - Appendix Extra Bits.mp4
  • 003 Using The TerminalCommand Prompt.mp4 147.07M
  • 004 Running script.js In Node.mp4 11.86M
  • 005 Modules In Node.mp4 18.77M
  • 007 ES6 Modules In Node.mp4 61.48M
  • 008 Types of Modules.mp4 54.43M
  • 25 - BONUS SECTION.mp4
  • 749.Vue3开发训练营 从入门到精通，构建企业级应用程序_文件目录.txt 46.45kb