project.case-study

Shopping Todo

代購清單與優惠券系統

跨平台代購清單管理應用：.NET 8 Web API 後端搭 JSON File Storage、Angular 20+ standalone 前端、Flutter 行動端共用 ApiResponse 契約。支援 Google / LINE 第三方登入、Email 驗證與帳號合併，部署於 Render.com Free Tier。

.NET 8Angular 20+FlutterTailwind CSSJSON StorageRender.com
前往作品 →

01 問題

海外代購與旅行採購清單常分散在 LINE 對話、便利貼與記事本，價格匯率與優惠券交叉計算容易出錯，多裝置之間又缺乏帳號整合。

02 解法

.NET 8 Web API + JSON File Storage 維持輕量、無資料庫部署；Angular 20+ Web 與 Flutter 行動端共用 wrapped ApiResponse 契約；外部登入串接 Google + LINE，從 ID Token 取得 email 並支援帳號綁定 / 合併與 Email 驗證；行動端啟動時做版本檢查提示更新。

03 成果

部署於 Render.com Free Tier（含 health check 路徑），支援 USD/EUR/TWD/JPY/GBP/CNY 六種幣別、繁中/英雙語、深色模式與 Google + LINE 外部登入。

04 功能特色

  • ▸ 多商店代購清單與商品價量追蹤
  • ▸ 購買進度視覺化（已購 / 未購）
  • ▸ 多語系（繁中 / 英）+ 6 種幣別
  • ▸ Dark Mode 切換
  • ▸ Google / LINE 外部登入 + Email 驗證 + 帳號綁定
  • ▸ 行動端版本檢查與更新提示
  • ▸ Flutter mobile + dio_client 重試