月份: 2025 年 2 月

發佈日期: 作者:

使用 n8n + LineBot 搭建 RAG AI 應用

功能介紹

n8n 是一款開源的工作流自動化工具，旨在幫助用戶通過可視化的方式設計和執行自動化流程，實現跨應用和服務的數據整合與操作。是一個功能強大且靈活的工作流自動化平台，適合個人和企業用戶用於提升效率和簡化業務流程。無論是簡單的數據同步，還是複雜的跨平台自動化，n8n 都能提供可靠的解決方案。

簡單n8n 串接 LINE 教學

n8n 是一款強大的工作流自動化工具，能夠輕鬆串接 LINE 並實現多種自動化功能，例如發送通知、處理訊息或與其他應用整合。以下是串接 LINE 的詳細教學：

步驟 1：準備 LINE API 憑證

在串接 LINE 前，您需要取得 LINE 的 API 憑證。以下是準備步驟：

  1. 註冊 LINE Developers 帳戶：前往 LINE Developers 註冊帳戶。
  2. 建立 Channel：
    • 登入後，建立一個新的 Messaging API Channel。
    • 記下 Channel ID、Channel Secret 和 Access Token，這些將用於 n8n 的認證設定。
  3. 設定 Webhook（可選）：如果需要接收 LINE 的事件通知，需設定 Webhook URL，該 URL 可由 n8n 提供。

步驟 2：在 n8n 中新增 LINE 節點

N8N設定的畫面

LINE Bot的設定畫面

步驟 3：在OpenAI建立好的客製化機器人

網址: https://platform.openai.com/playground/assistants

以下是了解我的書的內容的機器人，這個是Open AI的Agent功能，可以在這邊上傳檔案，讓這個機器人有RAG的資料庫可以回答專屬於自己的知識

步驟4：在n8n呼叫已經建立好的機器人

可以選擇下面這個節點來和已經建立好的機器人聊天

要注意的是，這個節點輸入的文字要是前一個節點的”chatInput”變數。所以要在前面新增一個Edit Fields的節點，來改變前一個節點的值的結構

選擇剛剛建立好的機器人

步驟5：回覆LINE訊息

因為原本n8n只有notify的元件，而這個元件即將要廢棄

因此我自己參考這邊的API格式來呼叫send line message

https://developers.line.biz/en/docs/messaging-api/sending-messages/#reply-messages

curl -v -X POST https://api.line.me/v2/bot/message/reply \
-H 'Content-Type: application/json' \
-H 'Authorization: Bearer {channel access token}' \
-d '{
    "replyToken":"nHuyWiB7yP5Zw52FIkcQobQuGDXCTA",
    "messages":[
        {
            "type":"text",
            "text":"Hello, user"
        },
        {
            "type":"text",
            "text":"May I help you?"
        }
    ]
}'

這邊因為要避免OPENAI回傳一些會打亂JSON格式的特殊字元，因此要用JSON.stringify(…)把回傳的字串包起來

{
    "replyToken":"{{ $('If').item.json.body.events[0].replyToken }}",
    "messages":[{"type":"text","text":{{ JSON.stringify($json.output) }}}]
}

完整的工作流

發佈日期: 作者:

codeium的AI編輯器windsurf

VS Code的AI開發助手

官方網址: https://codeium.com/windsurf

使用手冊: https://docs.codeium.com/getstarted/overview

大力推荐文(別人的): https://codelove.tw/@tony/post/xNgR53

Codeium 是一款免費的人工智慧編程助手，支援多種程式語言（如 Python、JavaScript、TypeScript、Java、Go 等），並提供程式碼補全、聊天互動及智能搜索等功能。

Codeium 的主要功能

1. 程式碼補全與重構

利用其深度的上下文感知功能，Windsurf 能夠掃描整個程式碼庫，識別所有相關的程式碼片段。
開發者只需在 Cascade 模式中輸入指令，例如「將所有函式名稱改為駝峰式命名」，Windsurf 即可自動完成多個檔案的修改，並確保程式碼的一致性。
同時，Windsurf 提供即時的重構建議，協助優化程式碼結構並提升可讀性。

2. 自動生成測試案例

開發者在 Cascade 中輸入指令，例如「為 calculate_interest 函式生成單元測試，涵蓋所有邊界條件」。
Windsurf 會自動產生多個測試案例，並根據函式的邏輯自動檢查可能的異常情況。
測試案例生成後，開發者還可以進一步要求 Windsurf 優化測試邏輯，或新增更多測試場景，以確保應用的穩定性與可靠性。

3. 跨文件的依賴分析與優化

Windsurf 能夠自動掃描專案中的 package.json 或其他依賴檔案，生成模組之間的依賴圖，幫助開發者清楚掌握各模組的關聯性。
開發者可以要求 Windsurf 提供優化建議，例如「減少模組 A 和模組 B 之間的耦合」，Windsurf 會自動分析並建議重構方案，以降低系統的相依性並提升可擴充性。
此外，Windsurf 也支援自動更新依賴版本，確保專案始終使用最新的穩定版本，降低潛在的安全風險與相容性問題。

4. 自然語言生成程式碼

開發者在 Cascade 中輸入指令，例如：「建立一個使用 React 的網頁應用，包含用戶註冊和登入功能」。
Windsurf 隨即自動生成專案結構、前端介面程式碼以及後端 API，並內建基本的安全性驗證機制（如密碼加密與登入令牌處理）。
此外，在夜間啟用自動優化功能後，Windsurf 進一步改進資料庫查詢效能，優化 API 響應速度，並額外添加密碼強度檢測機制，以提升應用的安全性與使用者體驗。

5. 即時錯誤修復與優化

幫助開發者重構程式碼、添加注釋或精簡程式碼：

  • 在程式碼中選擇需要重構的部分，然後在聊天界面中輸入需求，例如「請重構這段程式碼」。
  • Codeium 會提供優化建議，並解釋修改原因。

Codeium 的優勢

  • 免費使用：Codeium 對個人用戶完全免費，且無使用次數限制。
  • 多語言支持：支援超過 70 種程式語言，包括 Python、JavaScript、TypeScript、Java、Go 等。
  • 高效開發：通過程式碼補全、聊天和搜索功能，顯著提升開發效率。

如何提高程式碼補全的準確性

1. 提供清晰的上下文

Codeium 的程式碼補全功能依賴於上下文感知，因此提供清晰且完整的上下文是提升準確性的關鍵：

  • 打開相關文件：Codeium 的上下文引擎會分析當前打開的文件以及專案中的其他文件，確保建議與整體程式碼邏輯一致。
  • 使用註解描述需求：在程式碼中添加清晰的註解，例如「# 寫一個計算斐波那契數列的函數」，Codeium 會根據註解生成相應的程式碼。
  • 保持程式碼整潔：清晰的變數命名、結構化的程式碼和有意義的註解能幫助 Codeium 更準確地理解上下文。

2. 善用提示工程（Prompt Engineering）

提示工程是與 AI 工具互動的核心，以下是一些實用技巧：

  • 具體化需求：在提示中明確描述需求，例如「為函數 calculate_sum 寫一個單元測試，涵蓋所有邊界條件」。
  • 分步操作：對於複雜任務，將需求拆解為多個簡單步驟，逐步向 Codeium 提出請求。例如，先生成函數框架，再補充細節。
  • 使用 Codeium Chat：如果補全結果不符合預期，可以通過內建的聊天功能進一步詢問或要求修改。

3. 使用插件的高級功能

Codeium 提供多種功能來提升補全準確性，熟悉並善用這些功能可以顯著改善體驗：

  • 多選建議：按下快捷鍵（如 Alt + ] 或 Alt + [）切換不同的補全建議，選擇最符合需求的版本。
  • 上下文固定（Context Pinning）：在需要時固定特定的上下文，確保 Codeium 將其作為補全的參考。
  • 自定義上下文：對於專案中特定的 API 或內部庫，可以手動提供相關文檔或示例程式碼，幫助 Codeium 更好地理解。

4. 定期更新與設置優化

保持插件的最新版本並進行適當的設置調整，有助於提升補全效果：

  • 更新插件：Codeium 團隊會定期優化模型和功能，確保使用最新版本以獲得最佳性能。
  • 調整補全觸發條件：如果覺得補全建議出現過早或過晚，可以在設置中調整觸發條件。
  • 啟用語言伺服器：確保語言伺服器正常運行，這是 Codeium 提供高質量建議的基礎。

5. 適應專案需求的最佳實踐

根據專案特性採取針對性的措施：

  • 多語言支持：Codeium 支援超過 70 種程式語言，確保在專案中選擇正確的語言模式。
  • 程式碼風格一致性：Codeium 會嘗試匹配專案的程式碼風格，開發者應保持專案內部的命名規範和格式一致。
  • 小型專案與大型專案的區別：對於小型專案，Codeium 的單文件補全效果最佳；而在大型專案中，應充分利用其多文件上下文感知功能。
發佈日期: 作者:

雛型程式開發AI工具介紹

v0 by Vercel

官方網站：https://v0.dev/

v0 by Vercel 是由 Vercel 推出的一個開發工具，旨在幫助開發者快速構建和部署各種網頁應用和元件。該工具的核心功能是提供一個開放的社群平台，開發者可以從中獲取靈感、分享項目，並基於現有的範例進行快速開發。

這個平台提供了大量由社群貢獻的範例項目，這些項目涵蓋了多種應用場景，例如： AI SDK 聊天機器人、加密貨幣儀表板、3D 登陸頁面、動態背景生成、卡片生成器、音樂播放器等。 每個範例都可以被 Fork（複製）並用於自己的項目，大大降低了開發的門檻。可以快速將範例或自定義項目部署到線上，並即時查看效果。

特別適合需要靈感或快速原型開發的開發者。其社群驅動的範例庫和快速部署功能是其主要亮點。然而，對於需要更高自定義或複雜功能的項目，可能需要搭配其他工具使用。

bolt

官方網站：https://bolt.new/

bolt.new 是一個專注於快速構建、運行、編輯和部署全棧網頁應用的平台。該網站的核心功能是提供一個簡化的開發環境，讓用戶能夠快速實現從構想到部署的完整流程。其目標用戶可能包括開發者、設計師以及需要快速原型開發的團隊。這是一款創新的 AI 驅動全端開發工具，特別適合需要快速構建原型或 MVP 的開發者和團隊。其零配置、即時預覽和一鍵部署功能大幅簡化了開發流程。然而，對於需要更高穩定性和複雜功能的專案，Bolt.new 可能仍需進一步完善。

網站首頁的標語為「Prompt, run, edit, and deploy full-stack web apps」，這表明該平台的主要特點是：

  • Prompt：快速啟動項目。
  • Run：運行應用程式。
  • Edit：即時編輯代碼。
  • Deploy：快速部署應用。

這樣的功能設計適合需要快速迭代和測試的開發場景。

Replit

使用心得的文章：https://blog.creatorhome.tw/ai-hackathon/

文章中介紹了他利用 AI 的協助，實現了兩大主要功能：一個是透過問卷內容和 AI API 推薦禮物的功能，另一個是客製化祝福卡片並提供可下載的信件圖片和語音轉換功能的功能。

官方網站：https://replit.com

Replit是一款具有多人協作和開發者社群功能的寫程式工具，且用戶不必在電腦設定複雜的環境安裝或程式下載，直接在瀏覽器中打開網站，就能開始寫程式、發作品。從2016年上線至今，用戶累積突破1,000萬人。這是一個線上集成開發環境（Integrated Development Environment，IDE），支援Python、Java、C++等50多種程式語言，並可將寫好的程式碼即時更新在GitHub儲存庫中，讓開發應用程式從無到有的過程，都能直接在Replit一站完成。

Replit還能像Google Docs一樣邀請多位用戶協作，學程式的過程可以不再孤單。Replit 更適合用來打造小型應用程式，使用體驗上可能不如本地開發環境順暢，且運行速度較慢。

主要功能：

  • 多語言支援： Replit 支援多種程式語言，讓開發者能夠在同一平台上進行不同語言的開發。
  • 即時協作： 多位使用者可以同時編輯同一專案，類似於 Google 文件的協作方式，方便團隊合作。
  • 一鍵部署： 使用者可以快速將應用程式部署並獲取公開連結，方便分享和展示專案。
  • AI 助手： 透過 Replit Agent，使用者只需描述需求，AI 即可自動生成程式碼並完成部署，適合沒有程式設計經驗的初學者。

21st.dev

官方網址:https://21st.dev/

21st.dev 是一個專為設計工程師打造的開源 React UI 元件平台，靈感來自 shadcn/ui。 21ST.DEV 該平台提供多樣化的預建元件和頁面模板，協助開發者快速構建高品質的使用者介面。 HUNTSCREENS.COM 使用者只需透過一條命令即可安裝所需元件，顯著提升開發效率。

主要功能：

  • 專業元件（Pro Components）： 提供專業級的 React 與 Tailwind CSS 元件，協助開發者快速構建精緻的使用者介面。 21st.dev
  • 登陸頁面（Landing Pages）： 包含多種頁面模板，如公告、背景、邊框、行動呼籲、客戶展示、比較、功能介紹、頁尾、英雄圖、圖片、地圖、導航選單、定價、捲動區域、推薦詞、文字、影片等，方便快速搭建網站。
  • UI 元素（UI Elements）： 提供豐富的 UI 元素，如手風琴、AI 聊天、警示、頭像、徽章、按鈕、日曆、卡片、輪播、核取方塊、日期選擇器、對話框、下拉選單、空狀態、檔案樹、檔案上傳、表單、圖示、輸入框、連結、選單、通知、數字、分頁、彈出視窗、單選群組、選擇器、側邊欄、登入、註冊、滑桿、載入器、表格、標籤頁、標籤、文字區域、提示、切換、工具提示等，滿足不同的設計需求。
  • Hooks： 提供 React Hooks，簡化狀態管理和副作用處理。

shadcn/ui

官方網站：https://ui.shadcn.com/

shadcn/ui 是一個開源的 React 元件集合，專為開發者提供設計精美且可高度客製化的 UI 元件。 與傳統的元件庫不同，shadcn/ui 採用「複製貼上」的方式，開發者可以直接將所需的元件程式碼複製到自己的專案中，進行深度客製化。

主要功能：

  • 多樣化的元件： 提供多種常見的 UI 元件，如按鈕、表單、對話框等，滿足不同的開發需求。
  • 基於 Tailwind CSS： 所有元件均使用 Tailwind CSS 構建，方便開發者進行樣式調整和主題設定。
  • 無障礙設計： 元件設計時考慮了無障礙性，確保應用程式對所有使用者友善。

許多開發者讚賞 shadcn/ui 的客製化能力，認為它提供了更大的靈活性，特別適合需要精細控制元件行為和樣式的專案。然而，也有使用者指出，對於僅需基本功能的專案，傳統的元件庫可能更為方便，因為它們提供了開箱即用的解決方案。

Lovable

官方網站：https://lovable.dev/

Lovable 是一款由人工智慧（AI）驅動的全端應用程式構建工具，旨在透過自然語言處理技術，讓使用者能夠以對話的方式快速建立網站和 Web 應用程式。 使用者只需描述想要的功能，Lovable 即可自動生成對應的程式碼，簡化了軟體開發流程，讓非技術人員也能輕鬆構建高品質的軟體。Lovable 的主要功能特點包括後端功能實現、精確編輯和支持大型代碼庫，這些特點使得 Lovable 在 AI 全栈應用程序構建器中具有獨特的優勢。

主要功能：

  • 自然語言生成程式碼： 使用者以自然語言描述所需功能，Lovable 會將其轉換為實際的程式碼。
  • 構建和部署網站/應用程式： 透過對話，使用者可以構建並部署完整的網站和 Web 應用程式。
  • 與 Supabase 整合： 支援與 Supabase 整合，方便使用者連接 Postgres 資料庫，處理資料儲存和使用者身份驗證。
  • GitHub 同步： 使用者可以將生成的程式碼同步至 GitHub，進行版本控制和程式碼管理。
  • 處理大型程式碼庫： Lovable 能夠處理包含超過 100,000 行程式碼的大型專案。