Vue 3 Playbook
Take your skills beyond the fundamentals of Vue. This course will teach you more advanced topics such as the rendering pipeline that powers Vue, lazy-loading and async components, advanced reactivity methods, and using TypeScript with Vue.
What you'll learn
Once you learn the fundamentals of Vue, you're ready to explore some adjacent and advanced topics. In this course, Vue 3 Playbook, you’ll explore some of those more advanced topics. First, you’ll explore Vue's rendering pipeline and how it works with the virtual DOM to efficiently render changes in the browser. Then, you'll dive into a few core application performance measures such as lazy-loading and asynchronous components. Next, you’ll discover reactivity methods such as watch and watchEffect as well as utility functions for working with reactive refs. Finally, you’ll learn how to work with TypeScript in your Vue applications. When you’re finished with this course, you’ll have the skills and knowledge of Vue 3 needed to build robust and advanced Vue applications.
Table of contents
- Getting Started 2m
- Understanding the Virtual DOM 3m
- Understanding the Vue Render Pipeline 3m
- Using Vue Render Functions 7m
- Rendering Custom Components with Vue Render Functions 2m
- Using v-for in Vue Render Functions 4m
- Passing Items into Slots with Vue Render Functions 3m
- Handling Events in Vue Render Functions 1m
- Using v-if in Vue Render Functions 3m
- Understanding Fallthrough Attributes 4m
- Dynamic Components with Component :is 4m
- Getting Started 2m
- Lazy Loading Routed Vue Components 4m
- Async Components: Loading Child Components Asynchronously 7m
- Optimizing Props Stability 5m
- Handling Excessive Bindings on a Single Page 5m
- Using v-once to Reduce Binding Costs 3m
- Using v-memo to Reduce Binding Costs 4m
- Using shallowRef() to Reduce Binding Costs 3m
- Getting Started 2m
- Vue's Basic Reactivity Functions 4m
- Using readonly() to Protect Data 4m
- Using watch() to Respond to Data Changes 6m
- Accessing the New and Old Values with watch() 2m
- Setting watch() Options 3m
- Using watchEffect() 4m
- Using watchEffect() Options and Alias Functions 2m
- Stopping a Watcher 1m
- Getting Started 2m
- Creating a New Vue TypeScript Project 3m
- Setting up Vue TypeScript Tooling 2m
- Adding TypeScript to an Existing Vue Project 7m
- Creating Vue TypeScript Components 3m
- Using Type Only Imports in Vue TypeScript 3m
- Typing Reactive Methods 4m
- Typing Vue Component Props 5m
- Typing Vue Component Emits 4m
- Options API: Typing Vue Component Props 4m
- Options API: Typing Vue Component Emits 3m