Vue JS 3: The Composition API

5h 24m 26s
English
Paid

Course description

Vue.js 3 and the Composition API is here! Learn to build real world apps with the Composition API, TypeScript, Vue Router and testing with Vue Test Utils. This is an intermediate course. We move fast and introduce all the required topics to build highly dynamic, complex single page apps with Vue.js 3 and the new Composition API.

Read more about the course

Unlike other courses, testing and design patterns are at the core of everything we do. We explore the new features Vue.js 3 brings to the table. 

Some of the things you'll learn:

- how to use and test new Vue 3 features like Teleport and Suspense

- building resuable modules using the new reactivity API

- create a flux store from scratch

- Routing, include navigation guards with Vue Router 4

- Writing and testing complex interactions with Vue Test Utils

- TypeScript to create typesafe applications

This is a intermediate to advanced course; some basic programming knowledge is required. I respect your time and have packed as much content into the course as possible. We won't explain the same basic concept 10 times over, rather, move quickly and see the same concepts applied in different contexts to reinforce them.

Watch Online

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 55 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing

Watch Online Vue JS 3: The Composition API

0:00
/
#1: Installation and Configuration

All Course Lessons (55)

#Lesson TitleDurationAccess
1
Installation and Configuration Demo
03:56
2
Vue Single File Components
07:07
3
Directives and the Setup Function
03:58
4
Bindings with v-bind
03:06
5
Reactivity with ref
05:20
6
Derived Data with computed
06:31
7
Testing with Vue Test Utils (Part 1)
05:16
8
Testing with Vue Test Utils (Part 2)
06:53
9
Refactoring with Confidence
05:21
10
Loading with Suspense
04:51
11
Defining a Reactive Store
03:50
12
State Data Structures
05:03
13
Fetching Posts Asynchronously
04:05
14
The useStore Composable
07:51
15
Mocking Axios
04:34
16
Testing with Vue Test Utils (Part 3)
08:44
17
Routing with Vue Router
05:59
18
New Post Route
04:13
19
Post Editor and Volar
05:48
20
v-model Directive and Template Refs
07:10
21
Two way binding with contenteditable
06:14
22
Rendering HTML with Marked
09:11
23
Syntax Highlighting
05:41
24
Quick Styling Fix
02:43
25
Optimizations: watch, watchEffect and debounce
07:10
26
Custom Events and Saving a Post
07:16
27
Testing with Vue Test Utils (Part 4)
12:46
28
Persisting Posts and Routing with useRouter
08:11
29
Teleport for Modals
03:36
30
Creating the useModal Composable
05:08
31
v-model with Custom Components
07:30
32
Framework Agnostic Validation
10:10
33
Signup Form Component
07:24
34
Fixing a bug in FormInput
02:52
35
Submitting the Form and Event Modifiers
07:38
36
Plugins with Provide and Inject
05:51
37
Testing Plugins - Testing with Vue Test Utils (Part 5)
04:36
38
Testing New Post - Testing with Vue Test Utils (Part 6)
07:48
39
Introduction to Authentication and Authorization
01:41
40
Persisting Users
06:19
41
Dynamic Components
08:06
42
Optimizations with markRaw
04:32
43
Advanced Routing with Router Guards
08:43
44
Access Params with useRoute
05:44
45
Loading Posts and a Mysterious Bug
05:44
46
Editing Posts
03:15
47
Fixing Two Subtle Bugs
04:56
48
Authorizing the Current User
04:25
49
Conditional Edit Button
01:55
50
Testing Vue Router - Testing with Vue Test Utils (Part 8)
09:20
51
Test Maintenance - Testing with Vue Test Utils (Part 9)
07:46
52
Rendering Post HTML
04:54
53
Editing Posts
03:54
54
Modular Tests - Testing with Vue Test Utils (Part 10)
07:30
55
Deploying to Production
04:21

Unlock unlimited learning

Get instant access to all 54 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Comments

0 comments

Want to join the conversation?

Sign in to comment

Similar courses

Mastering Nuxt, 2025 Edition

Mastering Nuxt, 2025 Edition

Sources: masteringnuxt.com, Michael Thiessen
Mastering Nuxt: Full Stack Unleashed - 2025 Edition - is not just a course, but a comprehensive step-by-step guide to modern Nuxt, created with the...
7 hours 36 minutes 9 seconds
Ethereum and Solidity: Build Dapp with VueJS

Ethereum and Solidity: Build Dapp with VueJS

Sources: udemy
Build Decentralized Application using VueJS and Smart Contracts written in Solidity. Learn how to create simple smart contracts. Learn how to develop Decentrali
1 hour 45 minutes 9 seconds