Vue 3：建立行動和桌面應用程式（使用 Quasar 2 和 Pinia）

使用 Vue 3（組合 API）、Quasar 2 和 Pinia 建立適用於 Web、iOS、Android、Mac 和 Windows 的跨平台應用程式

從這 7.5 小時的課程，你會學到

• 如何使用 Vue 3 和 Quasar 2 創建資金管理應用
• 如何使用 Pinia 管理應用程式的狀態（設定 Store）
• 如何使用 Electron 將應用程式部署到 Mac 和 Windows 平台
• 如何使用 Capacitor 將應用程式部署到 iOS 和 Android 平台

要求

• 具備 Ja​​vaScript 基礎知識
• 具備 Vue 3 和 Composition API 基礎知識
• Mac 用戶優先（但非必要）

課程說明

在本課程中，您將學習如何使用 Vue 3、Composition API、Quasar V2 和 Pinia 建立一個名為 Moneyballs 的漂亮的跨平台資金管理應用程式 – 適用於 Web、iOS、Android、Mac 和 Windows。

在這個應用程式中，我們可以新增收入和支出條目並追蹤我們的支出。

我們所有的收入條目都是綠色的，所有支出條目都是紅色的，金額都以貨幣格式整齊地顯示。

我們可以：

• 查看底部的平衡條，它始終顯示所有條目的整體平衡。
• 透過點擊名稱或金額欄位來編輯我們的條目。
• 透過向右滑動將條目標記為已付款（並查看已付款條目的餘額）。
• 重新排列我們的條目。
• 向左滑動即可刪除我們的條目。

Moneyballs 還有一個「設定」頁面，其中有許多不同的設定。

我們可以：

• 停用刪除提示 – 這樣當我們在條目上向左滑動時 – 它會被立即刪除。
• 顯示運行餘額，該餘額顯示在我們所有條目下。
• 更改貨幣符號。
• 我們甚至還有配色方案完全不同的暗黑模式。

如果我們退出並重新啟動我們的應用程式（或重新載入網頁） – 我們的所有條目資料和設定資料都會保留。

在創建 Moneyballs 時你也會使用：

• Pinia 設定商店
• Quasar 外掛
• 自訂指令
• 自訂可組合項
• Conpacitor 外掛
• 大量 Quasar 組件
• 還有更多…

我們將讓這個應用程式在五個不同的平台上運作和運作：

• Web 瀏覽器
• iOS
• Android
• Mac
• Windows

使用 Quasar（和 Capacitor）產生的 iOS 和 Android 應用程式實際上可以部署到 App Store 和 Play Store，並透過應用程式內購買、訂閱和廣告來獲利。

使用 Quasar（和 Electron）產生的 Mac 和 Windows 應用程式可以部署到 Mac 和 Windows 商店，或在線上分發。

對於本課程，我建議使用 Mac 並對 JavaScript、Vue 3 和 Composition API 有基本的了解。

目標受眾

希望創建可部署到各種應用商店（或線上分發）的行動和桌面應用程式的 Vue 3 開發人員

講師簡介

Danny Connell 獨立應用程式開發人員和講師

作為一名 Web 開發人員（包括前端和後端），我在英國的多家公司工作了 7 年，在 HTML、CSS、JavaScript、jQuery、PHP 等方面變得非常熟練。

在對應用程式更感興趣後，我作為混合應用程式開發人員工作了 2 年，使用 Angular、Ionic、Vue.js 等技術為慈善部門創建跨平台應用程式。

我創建了自己的成功應用程式 Fudget（適用於 iOS、Android、Mac 和 Windows），它是 iOS 上用戶評分最高的個人理財應用程式，下載量超過 150 萬次。 這最終讓我辭掉了工作，成為一名全職獨立應用程式開發人員，開發自己的應用程式。

我有一個年輕但成功的 YouTube 頻道，我還在那裡分享程式教學。

我非常高興能在 Udemy 分享我的知識！

字幕：英文

• 想要了解如何將英文字幕自動翻譯成中文? 請參考這篇 How-To

---

• Udemy 永久擁有課程 大多課程約 NT400 (點擊連結看更多)
• ✨年訂閱每月 NT350 🌈 悠遊 Udemy 的 26000+ 門課，最大化學習 ( 原價 NT635/月 )
• Udemy 現在越來越多課程有中文字幕，請參考 Soft & Share 中文線上課程
• 手機上點選優惠連結看到的價格比電腦上看到的貴
• ＄代表當地貨幣, 如在台灣為 NT
• 點選”報名參加課程”有可能因瀏覽器 cookies 轉久一點或回報錯誤而無法連上，請稍等刷新或重新點選就會出現

---

報名參加課程

Sponsored by Udemy

---

也許你會有興趣

• Vue 相關線上課程
• ★英語學習地圖 – 練好英文是最大的學習槓桿
• 如何找工作學習地圖 – 找工作不要靠運氣！
• 從 Soft & Share 各種社團頻道挑選你喜歡的加入

不受 FB 演算法影響，歡迎透過 e-mail 訂閱網站更新