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

0 Like 0 留言 52 瀏覽

鐵人賽 Modern Web DAY 16

從 Web 到宇宙：Three.js × WebGL 互動式太陽系與光影實作系列第 16 篇

技術 Day 16 - OrbitControls：用滑鼠自由觀看整個太陽系

Day 15 我們已經讓 Camera 可以透過鍵盤切換不同視角。但都還是固定好的位置。今天我們要加入 OrbitControls讓使用者可以直接用滑鼠自由操作...

Andygong ‧ 2026-09-30 ‧團隊nutc imac

0 Like 0 留言 35 瀏覽

鐵人賽 Vibe Coding DAY 28

Vibe Coding 實戰手冊：30 天打造具備預算控管與數據視覺化的 React 記帳應用系列第 28 篇

技術 Day 28｜雲端部署：讓 React 記帳 App 正式上線

今天進入 Day 28，主要是把前幾天完成的 React 記帳 App 部署到 Vercel，讓原本只能在 localhost:5173 執行的專案，真正變成可...

czy06 ‧ 2026-09-29 ‧團隊我跟對面一隊

0 Like 0 留言 31 瀏覽

鐵人賽 Modern Web DAY 15

從 Web 到宇宙：Three.js × WebGL 互動式太陽系與光影實作系列第 15 篇

技術 Day 15 - Camera：從不同角度觀察太陽系

Day 14 我們已經使用 THREE.Clock，讓行星的自轉與公轉速度改成依照時間計算。今天我們要處理另一個很重要的東西 Camera。目前太陽系雖然已經會...

Andygong ‧ 2026-09-29 ‧團隊nutc imac

0 Like 0 留言 30 瀏覽

鐵人賽 Vibe Coding DAY 27

Vibe Coding 實戰手冊：30 天打造具備預算控管與數據視覺化的 React 記帳應用系列第 27 篇

技術 Day 27｜整理專案與編寫 README：讓成果有跡可循

今天進入 Day 27，主要是整理整個專案，並開始編寫 README.md。 README 到底是寫給誰看的？我整理後發現，README 不只是介紹作品，讓不同...

czy06 ‧ 2026-09-28 ‧團隊我跟對面一隊

0 Like 0 留言 53 瀏覽

鐵人賽 Modern Web DAY 14

從 Web 到宇宙：Three.js × WebGL 互動式太陽系與光影實作系列第 14 篇

技術 Day 14 - 不同速度：讓八大行星擁有自己的運行節奏

Day 13 我們已經替八大行星加入公轉軌道，現在每顆行星都可以沿著自己的軌道繞太陽運行。不過目前還有一個問題，我們的動畫速度是使用： planet.angle...

Andygong ‧ 2026-09-28 ‧團隊nutc imac

0 Like 0 留言 34 瀏覽

鐵人賽 Vibe Coding DAY 26

Vibe Coding 實戰手冊：30 天打造具備預算控管與數據視覺化的 React 記帳應用系列第 26 篇

技術 Day 26｜localStorage 安全防禦與資料備援：讓資料保存更穩定

今天進入 Day 26，原本設的目標在之前就順帶做了，所以今天主要是重新整理 App 的 localStorage，讓資料在讀取或寫入發生問題時，不會直接造成白...

czy06 ‧ 2026-09-27 ‧團隊我跟對面一隊

0 Like 0 留言 53 瀏覽

鐵人賽 Modern Web DAY 13

從 Web 到宇宙：Three.js × WebGL 互動式太陽系與光影實作系列第 13 篇

技術 Day 13 - 行星軌道：把看不見的公轉路線畫出來

Day 12 我們已經讓八大行星開始繞太陽公轉。今天要做的是把每顆行星的公轉路線畫出來。目前行星雖然有在繞太陽移動，但是沒有軌道線時，畫面會比較難看出它到底沿著...

Andygong ‧ 2026-09-27 ‧團隊nutc imac

1 Like 0 留言 43 瀏覽

鐵人賽 AI 自動化 DAY 15

訓練AI製作導覽解說的圖文資料系列第 15 篇

技術 Day15 走出戶外導覽的裝備系列1－適用的衣物

只要是戶外導覽，必定不能以在家或住所附近的穿著為準，以符合所到之處需要的環境、氣候做準備，不用準備「黃金聖衣」等級的貴松松裝備，只要符合「吸濕／排汗／透氣／彈力...

竹風之翼 ‧ 2026-09-27

0 Like 0 留言 73 瀏覽

鐵人賽 Vibe Coding DAY 25

Vibe Coding 實戰手冊：30 天打造具備預算控管與數據視覺化的 React 記帳應用系列第 25 篇

技術 Day 25｜狀態重構與目標刪除聯動：讓不同資料真正同步

今天進入第二十五今天的目標，使用 useContext 與 Custom Hook 重構 App 的狀態管理，減少原本需要一層一層傳遞的 Props。不過在完成...

czy06 ‧ 2026-09-26 ‧團隊我跟對面一隊

0 Like 0 留言 67 瀏覽

鐵人賽 Modern Web DAY 12

從 Web 到宇宙：Three.js × WebGL 互動式太陽系與光影實作系列第 12 篇

技術 Day 12 - 行星公轉：讓八大行星開始繞太陽運行

Day 11 我們已經讓八大行星開始自轉，並暫時使用 Wireframe 網格，讓旋轉效果比較容易觀察。今天要加入太陽系最重要的動畫之一行星公轉也就是讓行星不...

Andygong ‧ 2026-09-26 ‧團隊nutc imac

1 Like 0 留言 77 瀏覽

鐵人賽 AI 自動化 DAY 14

訓練AI製作導覽解說的圖文資料系列第 14 篇

技術 Day14 AI導覽模擬系列7-值得注意的宗教節慶活動導覽

關於宗教節慶結合旅遊是會讓人記憶深刻，如同臺灣本島的大甲媽和白沙屯媽遶境，當然馬祖保有閩東祭祀的舊俗，旅客到這裡一定要提醒，務必遵守當地禁忌，以下會挑出比較特別...

竹風之翼 ‧ 2026-09-26

0 Like 0 留言 41 瀏覽

鐵人賽 Vibe Coding DAY 24

Vibe Coding 實戰手冊：30 天打造具備預算控管與數據視覺化的 React 記帳應用系列第 24 篇

技術 Day 24｜提示訊息與介面優化：讓操作結果被看見

今天主要目標是幫記帳 App 加入操作提示，讓使用者在執行動作後，可以知道功能是否成功。除了提示功能之外，今天也一起優化了多國語言與設定頁面，將介面語言擴充成繁...

czy06 ‧ 2026-09-25 ‧團隊我跟對面一隊

0 Like 0 留言 108 瀏覽

鐵人賽 Modern Web DAY 11

從 Web 到宇宙：Three.js × WebGL 互動式太陽系與光影實作系列第 11 篇

技術 Day 11 - 行星自轉：讓八大行星開始旋轉

Day 10 我們已經把太陽與八大行星全部建立完成。今天開始讓太陽系真正「動起來」。這次我們會讓八大行星都加入自己的 rotationSpeed也就是自轉速度。...

Andygong ‧ 2026-09-25 ‧團隊nutc imac

0 Like 0 留言 45 瀏覽

鐵人賽 Vibe Coding DAY 23

Vibe Coding 實戰手冊：30 天打造具備預算控管與數據視覺化的 React 記帳應用系列第 23 篇

技術 Day 23｜錢包重構與動態存錢目標：讓資料真正連動

在原計劃中Day 23的目標是與外部 API 串接，但先前為了整體性我提早做好了這部分，於是今天主要是繼續優化前幾天加入的匯率功能。除此之外我還新增了「錢包」和...

czy06 ‧ 2026-09-24 ‧團隊我跟對面一隊

0 Like 0 留言 83 瀏覽

鐵人賽 Modern Web DAY 10

從 Web 到宇宙：Three.js × WebGL 互動式太陽系與光影實作系列第 10 篇

技術 Day 10 - 八大行星：建立完整的太陽系成員

今天開始加入太陽系最重要的成員「八大行星」。今天不會直接複製八份 SphereGeometry + Material + Mesh，而是開始把程式整理成「資料...

Andygong ‧ 2026-09-24 ‧團隊nutc imac

0 Like 0 留言 43 瀏覽

鐵人賽 Vibe Coding DAY 22

Vibe Coding 實戰手冊：30 天打造具備預算控管與數據視覺化的 React 記帳應用系列第 22 篇

技術 Day 22｜歷月財務報表與跨月趨勢圖

我今天幫 App 新增了歷史月報與跨月趨勢分析。前面的功能主要是在看「這個月花了多少」，今天進一步把不同月份的資料整理起來，讓使用者可以比較每個月的收入、支出與...

czy06 ‧ 2026-09-23 ‧團隊我跟對面一隊

0 Like 0 留言 91 瀏覽

鐵人賽 Modern Web DAY 9

從 Web 到宇宙：Three.js × WebGL 互動式太陽系與光影實作系列第 9 篇

技術 Day 9 - 打造全螢幕 3D 太陽系

前面幾天我們都是使用固定大小的 800 × 500 來顯示 Three.js 畫面。從今天開始，我們要把原本的小型 Three.js 畫面改造成全螢幕 3D...

Andygong ‧ 2026-09-23 ‧團隊nutc imac

0 Like 0 留言 112 瀏覽

鐵人賽 AI Engineering DAY 8

Harness Engineering × Pi Agent 實戰：打造可觀測、可評估的 AI Coding Agent 系列第 8 篇

技術 Day8：Agent 如何讀懂專案規則？拆解 AGENTS.md 的載入與優先順序

今天拆第一個元件量測台搭好了，第一輪「拆一個元件、隔天量它」從 AGENTS.md 開始。它是 Day3 地圖上「看現況」那一站最重要的東西：把「這個專案該怎...

eating11111 ‧ 2026-09-22 ‧團隊nutc imac

0 Like 0 留言 64 瀏覽

鐵人賽 Modern Web DAY 8

從 Web 到宇宙：Three.js × WebGL 互動式太陽系與光影實作系列第 8 篇

技術 Day 8 - 3D 座標與空間：開始安排行星的位置

一、今天完成目標今天我們會完成：再次認識 X、Y、Z 座標建立多個 3D 球體使用 position 設定不同位置讓不同物件出現在 3D 空間初步...

Andygong ‧ 2026-09-22 ‧團隊nutc imac

0 Like 0 留言 92 瀏覽

鐵人賽 Vibe Coding DAY 21

Vibe Coding 實戰手冊：30 天打造具備預算控管與數據視覺化的 React 記帳應用系列第 21 篇

技術 Day 21｜路由重構與多幣別結算

今天我幫App做了兩個大的升級：加入 React Router，把原本塞在一起的功能拆成不同頁面；同時完善多幣別的換算與顯示。用 React Router 把...

czy06 ‧ 2026-09-22 ‧團隊我跟對面一隊

2 Like 0 留言 59 瀏覽

鐵人賽 AI 自動化 DAY 12

訓練AI製作導覽解說的圖文資料系列第 12 篇

技術 Day12 AI導覽模擬系列6-1 北竿篇前篇

若搭飛機從臺北松山機場到馬祖，可以選擇直飛北竿，也可以選擇直飛南竿，喜歡人文可以直飛北竿，喜歡熱鬧和美食可以直飛南竿，筆者個人導覽喜歡從北竿開始。若從北竿機場下...

竹風之翼 ‧ 2026-09-24

1 Like 0 留言 81 瀏覽

鐵人賽 Modern Web DAY 7

從 Web 到宇宙：Three.js × WebGL 互動式太陽系與光影實作系列第 7 篇

技術 Day 7 - Geometry、Material、Mesh：打造 3D 物件

DAY 6 我們學會了 3D 座標。也學會了： position → 位置rotation → 旋轉scale → 大小今天我們來了解 Three.js...

Andygong ‧ 2026-09-21 ‧團隊nutc imac

0 Like 0 留言 45 瀏覽

鐵人賽 Vibe Coding DAY 20

Vibe Coding 實戰手冊：30 天打造具備預算控管與數據視覺化的 React 記帳應用系列第 20 篇

技術 Day 20｜RWD 響應式設計：讓記帳 App 在手機上也不爆版

今天我要幫記帳 App 加入 RWD（響應式網頁設計）。我發現我的app到了手機上會出現左右欄位擠在一起、Header 按鈕爆框等問題，因此今天主要讓 App...

czy06 ‧ 2026-09-21 ‧團隊我跟對面一隊

0 Like 0 留言 39 瀏覽

鐵人賽 Vibe Coding DAY 19

Vibe Coding 實戰手冊：30 天打造具備預算控管與數據視覺化的 React 記帳應用系列第 19 篇

技術 Day 19｜讓記帳 App 支援多國匯率

今天主要是讓使用者在新增他國的幣別時，可以自動轉換讓使用者可以更方便了解自己的支出與收入。讓記帳 App 支援多種幣別我希望使用者不只能記錄台幣，也可以輸入美...

czy06 ‧ 2026-09-20 ‧團隊我跟對面一隊

1 Like 0 留言 92 瀏覽

鐵人賽 AI 自動化 DAY 9

訓練AI製作導覽解說的圖文資料系列第 9 篇

技術 Day9 AI導覽模擬系列4-漁港篇

漁港的天氣也是難以捉摸，可能一下子烈陽高照，一下子海風大作，一下子又飄雨不斷，因此，帶導覽的人會列上幾樣隨身用品，把這些用品列入清單，大致上跟旅行社作法差不多，...

竹風之翼 ‧ 2026-09-21

0 Like 0 留言 54 瀏覽

鐵人賽 Vibe Coding DAY 18

Vibe Coding 實戰手冊：30 天打造具備預算控管與數據視覺化的 React 記帳應用系列第 18 篇

技術 Day 18｜加入暗黑模式

今天主要替記帳 App 加入 Dark Mode 暗黑模式，讓使用者可以選擇自己想要的主題。加入全域暗黑模式我在 Header 加入暗黑模式切換按鈕，並用 i...

czy06 ‧ 2026-09-19 ‧團隊我跟對面一隊

0 Like 0 留言 69 瀏覽

鐵人賽 Modern Web DAY 6

你的第一本 AEO x GEO 教戰手冊系列第 6 篇

技術 Cloudflare AI Crawl Control 開箱！免費版有什麼

過去五天我們都在幹同一件苦差事：從自己的 log 裡把 AI 爬蟲挖出來、驗明正身、看他們到底理不理 robots.txt。這套功夫很有價值，但真的很折騰人。...

Ryvn's Boss ‧ 2026-09-19

0 Like 0 留言 99 瀏覽

鐵人賽 Modern Web DAY 5

從 Web 到宇宙：Three.js × WebGL 互動式太陽系與光影實作系列第 5 篇

技術 Day 5 - Three.js：正式建立第一個 3D 世界

今天終於要進入這次 30 天專案的核心之一：Three.js。Three.js 是建立在 WebGL 上的 JavaScript 3D 函式庫，可以幫我們簡化很...

Andygong ‧ 2026-09-19 ‧團隊nutc imac

1 Like 0 留言 53 瀏覽

鐵人賽 AI 自動化 DAY 7

訓練AI製作導覽解說的圖文資料系列第 7 篇

技術 Day7 AI導覽模擬系列2-進入淺山導覽前的預備

需要製作完整的離線地圖淺山應該看做海拔較低，離平原較近，但畢竟還是有些高度，隨時會讓手機訊號消失，如果要導覽類似的活動梯隊，不管是自己製作的離線地圖，或下載...

竹風之翼 ‧ 2026-09-19

0 Like 0 留言 49 瀏覽

鐵人賽自我挑戰組 DAY 2

用數據守護雙眼：生活型態對視力影響的探索性資料分析系列第 2 篇

技術雲端開局！使用 Google Colab 快速打造分析環境與中文繪圖設定

昨天我們確立了專案的主軸與30天藍圖，今天進入實作第一步：搭建雲端分析環境。為了把精力聚焦在「數據探索」本身，避免卡在本機安裝 Python、設定環境變數或套...

Lin. ‧ 2026-09-16