iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

0 Like 0 留言 77 瀏覽

鐵人賽自我挑戰組 DAY 1

Angular 開發二三事系列第 1 篇

技術 Day1: 開賽感言

會選定《Angular 開發二三事》當題目源自於進入新公司沒多久後就因為甲方改變了需求，要求從 Vue 轉為 Angular 開發。曾經寫過 Vue、也寫過...

chiayinin ‧ 2026-09-15

0 Like 0 留言 135 瀏覽

鐵人賽 Build on Google AI DAY 14

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 14 篇

技術 Day 14 - 建置 Firebase 基礎設施 - 透過 App Hosting 環境變數進行部署

我們的 Angular 應用程式目前已部署至 Firebase App Hosting，但尚未設定 Firebase API Key、Auth Domain、專...

Connie ‧ 2026-09-15

0 Like 0 留言 245 瀏覽

鐵人賽 Build on Google AI DAY 13

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 13 篇

技術 Day 13 - 建置 Firebase 基礎設施 - 將 GitHub 存放庫連結至 Firebase App Hosting

Firebase App Hosting 是我不可或缺的 Firebase 服務之一。它讓 Angular 應用程式的部署變得非常快速且容易。在定義 App H...

Connie ‧ 2026-09-14

0 Like 0 留言 187 瀏覽

鐵人賽 Build on Google AI DAY 12

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 12 篇

技術 Day 12 - 建置 Firebase 基礎設施 - Remote Config 預設值與 Firebase 設定物件

過去，在我的 Angular 專案中初始化 Firebase App 和 App Check，以及擷取 Remote Config 參數之前，我總是重複進行以下...

Connie ‧ 2026-09-13

0 Like 0 留言 1631 瀏覽

鐵人賽 Build on Google AI DAY 11

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 11 篇

技術 Day 11 - 建置 Firebase 基礎設施 - Firebase 專案

今天，我們將使用 Firebase MCP Server 為 Angular 應用程式建立 Firebase 專案。伺服器會呼叫工具來建立專案、新增 Web 應...

Connie ‧ 2026-09-12

0 Like 0 留言 192 瀏覽

鐵人賽 Build on Google AI DAY 10

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 10 篇

技術 Day 10 - 在 Angular 中加入 Angular Aria 支援 - 第二部分

在第一部分中，我們展示了如何使推薦和標籤列表符合 a11y 規範。在第二部分中，我們展示了 AudioTagsComponent 的程式碼重構，以及在新的 Vo...

Connie ‧ 2026-09-11

0 Like 0 留言 201 瀏覽

鐵人賽 Build on Google AI DAY 9

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 9 篇

技術 Day 9 - 在 Angular 中加入 Angular Aria 支援 - 第一部分

每當我在 Angular 中建立展示（demo）時，我都沒有注意到無障礙輔助功能（accessibility），儘管這對視障人士來說是一項重要的功能。當 Ang...

Connie ‧ 2026-09-10

0 Like 0 留言 150 瀏覽

鐵人賽 Build on Google AI DAY 8

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 8 篇

技術 # Day 8 - 在 Angular 中加入漸進式網頁應用程式（PWA）支援 - Part 2

Day 8 - 在 Angular 中加入漸進式網頁應用程式（PWA）支援 - Part 2 昨天，我們看到了觸發 MCP 伺服器工具並生成檔案的不同提示詞。...

Connie ‧ 2026-09-09

0 Like 0 留言 188 瀏覽

鐵人賽 Build on Google AI DAY 7

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 7 篇

技術 Day 7 - 在 Angular 中加入漸進式網頁應用程式（PWA）支援 - Part 1

漸進式網頁應用程式（Progressive Web App，PWA）具有許多優勢：離線功能：Service Worker 會快取各項資產（圖示、圖片、字型等...

Connie ‧ 2026-09-08

0 Like 0 留言 151 瀏覽

鐵人賽 Build on Google AI DAY 6

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 6 篇

技術 Day 6 - 自訂 Agent 規則設定檔

在配置了 ESLint 規則、Agent 技能與 MCP 伺服器之後，Gemini 的表現依然沒有完全符合我的預期。 Gemini 難以捉摸的行為在進行 AI...

Connie ‧ 2026-09-07

0 Like 0 留言 186 瀏覽

鐵人賽 Build on Google AI DAY 5

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 5 篇

技術 Day 5 - 在 Antigravity CLI 註冊全域 Chrome DevTool 與 Vitest MCP 伺服器 - Part 2

Chrome DevTool MCP 伺服器的設定非常簡單，但要在我的 MacOS 筆記型電腦上正常運作卻有些困難。最終，我請 AI 幫我解決了這個問題。 Ch...

Connie ‧ 2026-09-06

0 Like 0 留言 216 瀏覽

鐵人賽 Build on Google AI DAY 4

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 4 篇

技術 Day 4 - 在 Antigravity CLI 註冊全域 MCP 伺服器 - Part 1

我在 Antigravity CLI 中註冊了 Angular、Firebase、Stitch 和 Chrome DevTool MCP 伺服器。這對我進行全端...

Connie ‧ 2026-09-05

1 Like 0 留言 256 瀏覽

鐵人賽 Build on Google AI DAY 3

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 3 篇

技術 Day 3 - 新增關鍵的 AI 代理技能以打造成功的 Angular 與 Firebase AI Logic 專案

在開發全新的 Angular 與 Firebase AI Logic 專案時，我一直在使用這些 AI 代理技能（AI Agent Skills）。這些技能針對軟...

Connie ‧ 2026-09-04

1 Like 0 留言 231 瀏覽

鐵人賽 Build on Google AI DAY 2

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 2 篇

技術 # Day 2 - 建立包含程式碼品質開發依賴項與設定檔的全新 Angular 專案

歷史背景 Firebase AI Logic 在 2025 年以及 2026 年的大部分時間裡都不支援文字轉語音（Text-to-Speech），因此我舊的專案...

Connie ‧ 2026-09-03

1 Like 0 留言 249 瀏覽

鐵人賽 Build on Google AI DAY 1

2026年，如何利用 Antigravity CLI、Gemini、各項技能及 MCP Server 建構基於 Firebase 的 Angular 應用系列第 1 篇

技術 Day 1 - 我是如何在 2026 鐵人賽中想到這個主題的

在選擇要於 2026 鐵人賽中撰寫的主題時，我遇到了一些困難。我最終選擇了這個主題，因為在 2026 年，我使用 Antigravity CLI 和 Gemin...

Connie ‧ 2026-09-02

1 Like 0 留言 2938 瀏覽

技術在 Angular 中使用 Firebase AI Logic 與 Gemini 建構即時用戶端 TTS

在我之前發表於 Dev.to 平台的文章中，我示範了如何使用 Gemini 與 Firebase Cloud Functions 建構富有表現力的文字轉語音（...

Connie ‧ 2026-09-01

2 Like 0 留言 3243 瀏覽

技術完全離線：使用 LiteRT 與 Gemma 4 建置隱私優先的個人理財助理

想像一下，您擁有一位個人財務規劃師，能夠分析您敏感的交易歷史記錄、標記異常支出，並提供預算最佳化建議，而這一切都 100% 離線運行，直接在您的網頁瀏覽器中進行...

Connie ‧ 2026-08-27

0 Like 0 留言 3329 瀏覽

技術使用 Angular、Firebase AI Logic 與 Gemini Nano 打造混合式影像分析應用程式

本教學將示範如何使用 Angular、Firebase AI Logic 與 Gemini 打造混合式影像分析應用程式。使用者只需上傳圖片、點擊按鈕，並等待 G...

Connie ‧ 2026-08-08

0 Like 0 留言 3398 瀏覽

技術使用 Antigravity CLI 建置 Firebase AI Logic 應用程式

注意：本專案已提供 Google Cloud 額度。在這篇部落格文章中，我將示範如何使用 Antigravity CLI（這是一個透過技能 (skills)...

Connie ‧ 2026-07-16

0 Like 0 留言 1866 瀏覽

技術在 Angular 中使用相依性注入 (Dependency Injection) 遷移至 Firebase Server Prompt Templates

Firebase 推出了伺服器端提示詞範本（Server Prompt Templates），以在其基礎設施中代管提示詞範本。此範本遵循 DotPrompt 格...

Connie ‧ 2026-06-16

1 Like 0 留言 3562 瀏覽

技術建立富有情感與節奏的動態音訊：Gemini 3.1 Flash TTS、Angular 與 Firebase 雲端函式

Google 在 Gemini API、Vertex AI 中的 Gemini 以及 Gemini AI Studio 中發佈了用於 AI 音訊產生的 Gemi...

Connie ‧ 2026-05-03

0 Like 0 留言 1451 瀏覽

技術使用 Angular、Veo 3.1 Lite、Firebase Cloud Functions 和 Firebase Cloud Storage 擴展影片

Google 在 Gemini API、Gemini in Vertex AI 以及 Gemini AI Studio 中發佈了用於 AI 影片生成的 Veo...

Connie ‧ 2026-04-18

1 Like 0 留言 2029 瀏覽

技術使用 Angular、Veo 3.1 與 Firebase 雲端函式建立影片生成管線

在現代網頁應用程式中，將繁重的生成式人工智慧（Generative AI）邏輯從前端卸載到後端是必要的。在我的最新專案中，我重構了一個 Angular 應用程式...

Connie ‧ 2026-02-22

0 Like 0 留言 2203 瀏覽

技術使用 Gemini 2.5 Flash TTS、Angular v21 和 Firebase 串流 AI 語音

在這篇技術深潛中，我們將探討如何將最新的 Google Gemini 模型整合到現代網頁技術堆疊中。我們使用 Gemini 3 Flash Preview 來產...

Connie ‧ 2026-02-21

2 Like 0 留言 1794 瀏覽

技術 Lazy-load 翻譯資源：怎麼設計路由層、元件層，以及載入快取

後台系統在做 i18n 時，常見的問題是在處理翻譯資源怎麼下載的問題。一開始專案小，大家通常會把所有翻譯塞成一包，或至少塞成少數幾包，先能跑再說。但系統一長大，...

peace&love ‧ 2026-01-24

1 Like 0 留言 2336 瀏覽

技術 Angular 後台系統 i18n 套件比較：Angular 內建 i18n vs ngx-translate vs ngx-atomic-i18n

寫這篇文章是想推薦我做的i18n套件，藉由比較 Angular 最多人用的兩款套件，解釋為什麼做這款工具的原由。做後台系統（admin / dashbo...

peace&love ‧ 2026-01-08

10 Like 0 留言 33740 瀏覽

徵才 [徵才]Angular 講師(高雄/台南)

万十科技股份有限公司招募講師https://onceagain.tw/ 1.上班時間:09:00~18:002.地點:高雄(高雄軟體園區)台南(TTA新創園區)...

once.code ‧ 2025-10-02

0 Like 0 留言 288 瀏覽

鐵人賽 Modern Web DAY 29

Angular 新手練功日誌：從零到職場冒險系列第 29 篇

技術 Day 29 - Animations

今天會體驗一下新動畫 API animate.enter、animate.leave，讓我們能更簡單地為元件添加進場動畫效果。 Angular 作為主流前端框架...

johnson3669 ‧ 2025-09-29

0 Like 0 留言 277 瀏覽

鐵人賽 Modern Web DAY 28

Angular 新手練功日誌：從零到職場冒險系列第 28 篇

技術 Day 28 - Testing

今天要介紹 Angular 的單元測試，單元測試的目的是將程式碼切割成小單元，並針對每個單元進行測試，以確保它們的功能正確且符合預期，不會影響到其他部分。測試...

johnson3669 ‧ 2025-09-28

0 Like 0 留言 297 瀏覽

鐵人賽 Modern Web DAY 27

Angular 新手練功日誌：從零到職場冒險系列第 27 篇

技術 Day 27 - Routing （二）

今天會介紹一些昨天沒提到的路由功能，像是路由設定屬性、路由守衛以及延遲加載路由等功能路由設定屬性 **：通配符路由，用來匹配所有未定義的路由，通常用於顯示...

johnson3669 ‧ 2025-09-27