Vue 3: Create a Mobile & Desktop App (with Quasar 2 & Pinia) | Udemy

In this course, you’ll learn how to use Vue 3, the Composition API, Quasar V2 and Pinia to create a beautiful cross-platform  money management app called Moneyballs – for Web, iOS, Android, Mac & Windows.

In this app, we can add both income and expense entries and keep track of our spending.

All of our income entries are in green and all of our expense entries are in red, with the amounts beautifully formatted as currency.

We can:

• View a balance bar along the bottom, which always shows the overall balance of all of our entries.
• Edit our entries in place by clicking on the name or the amount field.
• Mark an entry as paid by swiping right (and see the balance of our paid entries).
• Reorder our entries.
• Swipe left to delete our entries.

Moneyballs also has a Settings page with a bunch of different settings.

We can:

• Disable the prompt to delete – so that when we swipe left on an entry – it’s deleted immediately.
• Show a Running Balance, which is displayed under all our entries.
• Change the Currency Symbol.
• We even have a Dark Mode with a completely different color scheme.

And if we quit and restart our app (or reload the webpage) – all of our entries data and settings data is maintained.

While creating Moneyballs you’re also going to use:

• Pinia Setup Stores
• Quasar Plugins
• Custom Directives
• Custom Composables
• Capacitor plugins
• Tons of Quasar Components
• And much more…

And we’re going to get this app running and working on five different platforms:

• Web Browser
• iOS
• Android
• Mac
• Windows

iOS & Android apps generated with Quasar (& Capacitor) can actually be deployed to the App Store & Play Store and monetized with in-app purchases, subscriptions and ads.

Mac & Windows apps generated with Quasar (& Electron) can be deployed to the Mac & Windows stores, or distributed online.

For this course, I recommend using a Mac and having a basic understanding of JavaScript, Vue 3 and the Composition API.