課程代號:2326070074  

Vibe Coding Web 應用系統開發實務班

這不是一門只教學員製作網頁的課程,而是以實際工作需求為起點,運用生成式 AI 與 Vibe Coding,將想法轉化為可操作、可測試、可持續優化的 Web 應用系統。

課程型態/
實體課程
上課地址/
工研院產業學院 台北學習中心。實際地點依上課通知為準!
時  數/
18 小時
起迄日期/
2026/11/02 ~ 2026/11/09
聯絡資訊/
林郁倢   02-23701111#609
報名截止日期:2026/10/29
課程介紹

從需求、規格與互動原型,到可登入、可儲存資料的 Web App

  生成式 AI  Vibe Coding 正在改變數位應用的開發方式。使用者可以透過自然語言說明工作情境、使用需求與預期成果,再由 AI 協助建立介面、功能、資料流程與程式原型。這種人機協作模式,讓企劃、行銷、講師、顧問、產品經理、行政及數位應用人員,不必從傳統程式語法開始,也能直接參與應用系統的規劃與開發。

  本課程以 Google Gemini Canvas  Firebase 為主要實作工具,從問題定義、使用者情境、價值主張、功能規劃及互動原型開始,逐步完成前端介面、會員驗證、雲端資料庫、基本權限與測試驗收。透過一致的 Google 生態系,降低工具切換與技術整合負擔,讓學員更專注於應用情境、流程設計與產品價值。

  課程採三天、十八小時完整專案制。前兩天建立 Vibe Coding 方法、互動原型、Web App 規格書與前後端架構;第三天以專案工作坊方式完成最小可行產品(MVP),進行錯誤修正、操作流程測試、行動版檢查與成果驗收。課程結束後,學員將完成一個具備前端互動、會員登入、雲端資料儲存與基本權限管理的 Web 應用系統,並建立測試紀錄與下一版優化計畫。

 

課程特色

  • 從工作需求出發:不是從語法開始,而是先釐清使用者、痛點、情境與價值。
  • 規格驅動開發:將需求整理為頁面、流程、資料欄位與驗收條件。
  • Google 生態系整合:運用 Gemini Canvas  Firebase 完成前端、登入、資料庫及基本權限。
  • 專案導向學習:三天完成一個可展示、可測試、可持續優化的 MVP
  • 適合非技術工作者:降低開發門檻,但仍建立系統化的產品與專案思維。

 

課程目標

  • 理解 Vibe Coding 的方法、工作流程、適用情境與使用邊界。
  • 能將工作需求轉化為 Web App 規格、頁面流程、資料結構與驗收條件。
  • 能使用 Gemini Canvas 建立互動介面與前端原型。
  • 能運用 Firebase AuthenticationFirestore 與基本安全規則,建立登入與雲端資料功能。
  • 能完成 MVP 測試、錯誤修正、成果驗收與下一版規劃。

 

課程對象

  • 企劃、行銷、講師、顧問、產品經理、行政與數位應用人員。
  • 希望以 AI 將工作流程、專業方法或創意構想轉化為數位工具者。
  • 希望建立 Web App 概念與產品開發能力,但不具傳統程式背景者。
  • 已有 AI 工具使用經驗,希望進一步完成可實際操作之應用系統者。

 

課程大綱

v 學員需自備 Google AI Pro 訂閱(約 NT$650/月;以 Google 官方公告為準),並於課前完成啟用與登入,以體驗課程全部實作內容。

第一單元-Vibe Coding 應用開發實戰
日期主題大綱時數

11/2

Vibe Coding 方法與互動原型

  • Vibe Coding 概念解析、工作流程與工具選型
  • No-code 網站與 Vibe Coding Web App 的差異
  • 文件互動化、資訊架構與互動設計
  • Gemini Canvas 原型生成、測試與迭代

6hr

11/3

Web App 規格書與全端架構

  • 使用者、痛點、情境與價值主張
  • 功能、頁面、流程、資料欄位與驗收條件
  • Firebase AuthenticationFirestore 與權限概念
  • 將規格書轉為 Canvas 開發指令與專案計畫

6hr

 

第二單元-Vibe Coding 全端 Web App 專案工作坊
單元主題大綱時數

11/9

全端 Web App 專案實作

  • 專案啟動:確認需求、MVP 與驗收條件
  • 前端開發:依規格書以 Gemini Canvas 建立介面與互動
  • 後端串接:會員登入、Firestore 資料新增與讀取
  • 權限與安全:使用者身分、資料範圍與基本規則
  • 測試優化:錯誤修正、操作流程與行動版檢查
  • 成果驗收:作品展示、測試紀錄與下一版規劃
6hr

 

講師簡介

楊文澤 資深科技顧問

  擁有超過 30 年科技產業、品牌行銷、數位轉型與 MarTech 實務經驗,曾任宏碁集團建碁股份有限公司整合營銷處處長、全球品牌行銷總監及公司發言人。長期投入生成式 AIVibe CodingAI 應用開發、數位行銷與企業數位賦能,擅長將複雜技術轉化為可理解、可操作、可落地的教學與商業應用。

現任智策慧品牌顧問有限公司資深科技顧問、龍華科技大學數位行銷暨跨境商務系兼任講師,並擔任企業、公協會及政府培訓計畫之 AI 與數位轉型講師及顧問。

  • 經歷:
    脈動心聯股份有限公司 創辦人暨執行長
    建碁股份有限公司(宏碁集團) 整合營銷處處長全球品牌行銷總監發言人

 

開課資訊

  • 上課時間:
    第一單元:11511/02()-11/03()09:30 ~12:00,13:00~16:30,計12小時。
    第二單元:11511/09()09:30 ~12:00,13:00~16:30 ,計6小時。

  • 上課地點:工研院產業學院 產業人才訓練一部(台北),實際地點依上課通知為準。

  • 課程洽詢:02-2370-1111 分機609林小姐 或304黃小姐

  • 學員需自備 Google AI Pro 訂閱(約 NT$650/月;以 Google 官方公告為準),並於課前完成啟用與登入,以體驗課程全部實作內容。

 

價格

報名方案一般報名早鳥優惠價
三周前報名
3()以上
團報價
全系列
Vibe Coding Web 應用系統開發實務班 (18H)
18,00016,20015,300 
單元一
Vibe Coding 應用開發實戰 (12H)
12,00010,80010,200
單元二
Vibe Coding 全端 Web App 專案工作坊 (6H)
6,0005,4005,100

 

繳費方式

  1. ATM轉帳(線上報名):繳費方式選擇「ATM轉帳」者,系統將給您一組轉帳帳號「銀行代號、轉帳帳號」,但此帳號只提供本課程轉帳使用,各別學員轉帳請使用不同轉帳帳號!!轉帳後,寫上您的「公司全銜、課程名稱、姓名、聯絡電話」與「收據」回傳至finn@itri.org.tw
  2. 信用卡(線上報名):繳費方式選「信用卡」,直到顯示「您已完成報名手續」為止,才確實完成繳費。
  3. 銀行匯款(公司逕行電匯付款):土地銀行 工研院分行,帳號156-005-00002-5(土銀代碼:005)。戶名「財團法人工業技術研究院」,請填具「報名表」與「收據」回傳至finn@itri.org.tw
  4. 工研院同仁:請從產業學院學習網直接登入工研人報名;俾利計畫代號扣款。

 

退費標準

  • 已完成報名與繳費之學員,課程主辦單位將於開課三天前以E-mail方式寄發上課通知函;若課程因故取消或延期,亦將以E-mail方式通知,如未收到任何通知,敬請來電確認。
  • 已完成繳費之學員如欲取消報名,請於實際上課日前以書面通知業務承辦人,主辦單位將退還80% 課程費用。
  • 學員於培訓期間如因個人因素無法繼續參與課程,將依課程退費規定辦理之:上課未逾總時數三分之一,欲辦理退費,退還所有上課費用之二分之一,上課逾總時數三分之一,則不退費。
  • 本單位保留是否接受報名之權利。
  • 如遇不可抗拒之因素,課程主辦單位保留修訂課程日期及取消課程的權利。