Vue JS 3: Composition API (with Pinia, Firebase 9 & Vite) (Udemy.com)
Already know the Options API? Switch over to the Composition API as quickly as possible! (Oh, and Pinia & Firebase 9!)
Created by: Danny Connell
Last updated July 2024
What you will learn
- How to switch over from Vue 2 & Options API to Vue 3 & Composition API
- Core differences between Options API & Composition API
- State Management using Pinia
- Create a real-world app from scratch with Vue 3, Composition API, Pinia & Vite
- Firebase 9, including Cloud Firestore, Authentication & Security Rules
Quality Score
No CourseDuck member has rated this course yet. Taken it? Give each part a thumbs up or down.
Overall Score : 88 / 100
Course Description
If you’re already familiar with Vue 2 & The Options API, then this course will teach you everything you need to know to switch over to (and get started with) Vue 3 & the amazing new Composition API.
My name’s Danny, I’m an Indie App Developer & Creator of Fudget, the highest rated personal finance app for iOS, Android, Mac & Windows.
And I’ve spent the last 12 months creating Fudget 2 - which is built on Vue 3 & The Composition API.
In this course you’ll start by learning the key differences between the Options API & Composition API by creating a simple Options API app & converting it to the Composition API.
You’ll then master all of the basics including:
Reactive data with Refs & Reactive Objects
Methods, Computed Properties & Watchers
Lifecycle Hooks
Directives
Vue Router
Child Components - including the new ways of handling props, emits & modelValue
Dynamic Components
Composables - how to create them from scratch & how to import them from the VueUse library
And you’ll learn State Management using Pinia, the incredible successor to Vuex
After learning the basics, you’re gonna create a real world app called Noteballs from scratch - which has full CRUD capabilities, uses Pinia for State Management and demonstrates real-world use of all the basics you learned earlier.
FIREBASE 9 UPDATE (JUN 2022):
The course has been updated with 3 hours of new content on Firebase 9, where we will:
Hook Noteballs up to a Firebase Cloud Firestore database
Add Authentication, so that multiple users can register, login and log out of our app
Add Realtime Data Sync, so that if a user adds a note on one device, they'll see the note instantly appear on another device
Add Firebase Security Rules to protect our users' data
Host our finished app on Firebase Hosting so that we can share it with anyone
After this course, you’ll be able to create your own Vue 3 apps based entirely on the Composition API - from scratch.
This course requires a basic understanding of Vue 2 & The Options API, HTML, CSS & JavaScript.
Please check out the preview videos & I look forward to seeing you in the course.
Instructor Details
- 4.4 Rating
2,474 Reviews
Danny Connell
I spent 7 years working for various companies in the UK as a Web Developer (both front- and back-end) becoming highly skilled in HTML, CSS, JavaScript, jQuery, PHP and many more.
After becoming more interested in apps, I worked for 2 years as a Hybrid App Developer, creating cross-platform apps for the charity sector using technologies including Angular, Ionic, Vue.js and more.
I created my own successful app called Fudget (for iOS, Android, Mac & Windows) which is the highest user-rated personal finance app on iOS with over 1.5 million downloads. This eventually enabled me to leave my job and become a full-time Indie App Developer, working on my own apps.
I have a young but successful YouTube channel where I also share coding tutorials.
I'm super excited to share my knowledge on Udemy!
More courses by Danny Connell
Quasar V1: Cross-Platform Apps (with Vue 2, Vuex & Firebase) (2022)
4.6 (1,956 Reviews)
Provider: Udemy
Time: 15.4h
$74.99
Vuetify 2: Create an App with Vue JS 2 & Vuex - in 5 Hours! (2022)
4.6 (788 Reviews)
Provider: Udemy
Time: 5.4h
$79.99
Quasar V1: PWA (with Vue JS 2, Firebase, NodeJS & Express) (2022)
4.8 (686 Reviews)
Provider: Udemy
Time: 14.9h
$74.99
Vue 3: Create a Mobile & Desktop App (with Quasar 2 & Pinia) (2024)
4.9 (177 Reviews)
Provider: Udemy
Time: 7.6h
$79.99
Quasar V1: Weather App for Mobile, Desktop & Web (Vue JS 2) (2022)
4.5 (157 Reviews)
Provider: Udemy
Time: 1.6h
$49.99
More Vue.js courses
Curso Vue JS 2 - O Guia Completo (incl. Vue Router & Vuex) (2024)
4.7 (6,106 Reviews)
Provider: Udemy
Time: 43h
$74.99
Complete Javascript & jQuery Course with Bonus Vue JS Intro (2021)
4.7 (2,716 Reviews)
Provider: Udemy
Time: 16.9h
$74.99
Vue JS 3 & Firebase - The Full Guide [2022] (2023)
4.7 (38 Reviews)
Provider: Udemy
Time: 19.7h
$69.99
Laravel + Vue 3 + Inertia: From Zero to Production SPA (2025)
4.6 (2,488 Reviews)
Provider: Udemy
Time: 19.5h
$84.99
Quasar V1: Cross-Platform Apps (with Vue 2, Vuex & Firebase) (2022)
4.6 (1,956 Reviews)
Provider: Udemy
Time: 15.4h
$74.99
Vue JS 3 For Modern Web Development - Beginner to Advanced (2024)
4.6 (1,035 Reviews)
Provider: Udemy
Time: 9.2h
$74.99
Reviews
By Alessandro Osti on 9/25/2025
Quando parla non si capisce niente. Sistema codice che non c'entra niente mentre spiega.
By Eduardo Penroz on 6/3/2024
This was an excellent course, Danny knows every detail of what he is teaching and does it in a simple and easy to understand way. I didn't have so much experience with the Composition API in Vue and could easily understand the concepts explained. This course will be very valuable for those who want to understand the Composition API. My next course will be the Vue and Quasar course recently published by Danny. Thank you very much for this awesome course!
By Ales Bombek on 5/12/2024
Vue explanations and presentation is very good. Questions response is also very good. I would expect a better app choice. I find Notes not really real-life (usable) example. And I find Bulma as UI Framework really bad. It is not flexible, it has a lack of components, etc. I know it is not a main focus of the course but it can direct one to a wrong direction. Prime Vue or Tailwind for example would be a lot better. Otherwise, good job! Thank you!
By Mark Keith on 4/25/2024
I believe I can learn practical content. The details of creating applications with Vue3 and Firebase are not very well covered in books, so it is very helpful. As my native language is Japanese, I need to review it several times, but I also learn English, which makes it doubly educational. In Japanese, we call this ‘一石二鳥(killing two birds with one stone)’.
By Albena Kostova on 3/16/2024
I just finished the course and I can confirm that it was much more than I was expecting! I have learned a lot and gained understanding of things that were clouded to me at the point where I began. I cant wait to apply what I have learned in my next project! Thank you Danny so very much for the course!!! I would recommend this course to anyone, regardless the skill level!
By Devkant . on 12/20/2023
This course was a refresher for me as I’ve worked on Vue.js 2 already, the demo project was also good and the addition of firebase makes it even better. In my opinion this course is not a beginner friendly (who are totally new Vue.js) because this course doesn’t talk about the reactivity system in the Vue.js ecosystem like the data in the template and the script is available differently, in template you can access it directly but in script section you need to do some additional steps sometimes. There is no extended support like in other courses they share some community link. I think this course can be a good fit for those who want to save some time and know Vue.js 2 already or maybe somewhat experienced with some other similar libraries / frameworks.
By Stefan Mohenski on 11/1/2023
For me, this course was amazing. Definitely worth every penny, and I'm looking forward to more Vue tutorials with more projects. What truly stood out in this course was the instructor's clear and concise explanations. The content was easy to follow, even for someone relatively new to Vue.js. The hands-on projects were a highlight, allowing me to apply what I learned immediately.
By Robert Gorczyca on 12/19/2022
This was a good match. I've taken several of Danny's Vue/Quasar courses, and wanted to take a Vue 3 course up-to-date as of 2022. There are just a handful of places in the course where material covered later could have been incorporated earlier - with an extra video or text screen - such as the issue with update:modelValue that wasn't addressed until the last video; but at least it was all covered. I hope there'll soon be a course incorporating the latest in Quasar & Vue 3, preferably one that uses axios, if just to grab some data via a non-Firebase API.
By Gustavo Deukmedjian on 10/26/2022
Thanks Danny, amazing course, as I expected. Clear, detailed, to the point. I really liked the parallel you did during the course between the options API and the composition API. That helps a lot to understand and see the benefits of the "composition new way". Thanks again, you are an amazing communicator. Greetings from Argentina.
By Giovanni Gadaleta on 9/3/2022
Mi piace questo corso perché l'autore è allo stesso tempo chiaro ed essenziale. In poche ore ha riunito e ordinato tutti i concetti e le funzionalità più importanti. In particolare mi ha sorpreso come sia stato facile, dopo il capitolo sui Composables, capire Pinia. I capitoli sulla creazione del Noteballs risultano utili perché si mette in pratica tutto ciò che è stato spiegato. Sono molto soddisfatto.







![Vue JS 3 & Firebase - The Full Guide [2022]](/programming/vue-js/images/4530334_c8de_4.jpg?v=1789444064)


