我負責的預約前台是用 Next.js 寫的,而不少會員是從店家的 LINE 官方帳號點進來,所以一開始就接了 LIFF,讓會員可以直接用 LINE 登入。之後我...
一、 前言 在前幾天的文章中,我們已經成功讓「AI 酒館」支援多角色切換,並且每個角色都有獨立的記憶。不過,隨著和調酒師 Mark 聊得越來越深入,玩家可能會同...
一、 前言 在前幾天的文章中,我們已經順利將 Google Gemini API 串接進「AI 酒館」中。然而,在 100% 前端運行的 Vite 專案裡,使用...
一、 前言 在前幾天的文章中,我們成功為「AI 酒館」建立了多角色獨立對話記憶,讓調酒師 Mark 與吟遊詩人 Bard 擁有各自獨立的對話宇宙。然而,如果切換...
一、 前言在前幾天的文章中,我們的「AI 酒館」已經變得非常生動:不僅有精美的暗色介面、雙向語音支援、Gemini AI 動態對話,還有流暢的打字機特效與自動捲...
一、 前言 在前幾天的文章中,我們的「AI 酒館」已經成功串接了 Google Gemini API,讓調酒師 Mark 與吟遊詩人 Bard 擁有了即時對話的...
大家好,我是 NextCandle 的開發者。上一篇分享了相似 K 線與歷史後續走勢的比較介面。這篇想談一個具體的資料呈現問題:畫面上的「案例數」,究竟在數什麼...
一、 前言在前面幾天,我們成功為「AI 酒館」打造了介面,並實現了讓玩家透過麥克風「動口不動手」的語音輸入功能。既然是沉浸式的酒館,光是聽得懂玩家說話還不夠,我...
大家好,我是 NextCandle 的開發者。想分享這個已上線、持續更新的專案,以及在市場資料介面上做的幾個實作選擇。 看圖時,常會覺得「這段走勢以前好像看過」...
一、 前言在前面兩天,我們透過 Vibe Coding 快速生成了「AI 酒館」的暗色調 UI 介面,並成功在本地端順利跑起來。身為一個沉浸式的酒館,如果全程只...
一、 今日目標與簡介今天的目標是透過 Vibe Coding 的方式,讓 AI 自動幫忙建立 React + Vite + Tailwind CSS 專案,並產...
動機大家好!在接下來的 30 天裡,我將挑戰一個極具實驗性與趣味性的專案——《用嘴巴寫出 AI 酒館》。這個專案的核心理念很簡單:我希望打造一個能讓使用者透...
現在很多 AI 旅遊工具,本質上是「很會講話的建議產生器」:它給你一段漂亮的行程文字,然後你要自己把每個景點、每個時間搬進行程表,一起出發的朋友再各抄一份。 我...
前言 前幾天,我們討論的是幾個後端經典案例,製作帳密登入以及權限控管的部分今天開始我們要開始往 bun 在前端的應用去做使用,那現今最主要的前端打包工具非屬...
昨天在製作過程中發現了一個問題 產業挑選後,進到評估模型的選擇,但模型選擇的認定只會使用默認的產業,不會變成其它的產業 因此今天首要任務是修正這個問題然後...
因為決定另開一個Angular+NestJS專案,所以這個專案就維持React+.NET吧!(握拳結果跟原本想得不一樣,這就是所謂計劃趕不上變化呀(笑 接著就先...
DOM DOM 全名 Document Object Model(文件物件模型)。 它是一種「把 HTML 文件轉換成可以用程式操控的物件結構(樹狀的資料結構)...
截至目前(2026/03) Next.js 最新且最受歡迎的技術,莫過於這個 App Router與他帶來的RSC架構與Server Actions API了,...
是一種前端框架(如 React, Vue)用來提升效能的概念,它在記憶體中用 JavaScript 物件模擬真實的 DOM 結構(DOM Tree),當資料變動...
一、state 的概念與用途 在 React 中,state(狀態) 是用來存放會隨著使用者操作而改變的資料。 與一般變數不同的是: 當 state 改變時,R...
一、props 的概念與用途 props 是「父元件 → 子元件」傳遞資料的機制。 它是唯讀的(read-only),子元件不能直接修改它。 透過 props,...
接著要來認識React的條件判斷式,可以根據不條件,來給組件回傳不同的網頁內容而判斷式中有幾個常見的用法,首先是三元運算子(ternary operator)...
可以在JSX中放入陣列(listItems)不過以這樣的寫法console中會顯示錯誤訊息正確的寫法:陣列中的每一個元素都應該要有key屬性,key屬性的用途主...
每個組件只能回傳一個元素 (物件),他不能同時回傳多個元素 說明: 代表一個元素,如果沒有用把三個元素包進一個元素裡,程式會報錯 ( javaScript本身的...
今天是鐵人賽的最後一天,剛好在昨天也介紹完了官方文件的 管理 State 篇章。後面還剩 逃脫出口 出口這個篇章沒介紹完,主要的內容會是對 React 以外的系...
30 天旅程回顧 終於來到了鐵人賽的最後一天!回顧這 30 天的挑戰,感觸良多。 我在軟體開發領域已經工作八年,從最初的後端工程師,到後來的全端工程師,再到區塊...
前言 歡迎來到倒數第二天! 我們昨天完成了在分支上的 React 程式碼實作測驗,確認了我們目前的實作是能撐起本地的測試的,雖然因為安全性的考量我們決定不在這次...
延續昨天的介紹,Context 除了透過傳給 Provider 不同的 value 值之外,也可以透過傳入 state 後,用 state 的更新去改變裡面的值...
前情提要 在過去的 Day 24-28 中,我們完成了 Kyo System 前端的核心功能: Day 24: 建立 React + Vite + Type...
在前面的篇章:Day 25 - 在 Component 之間共享 State,有介紹 state 可以透過 props 傳下去給其他 Component 使用。...