學習點樣用 Claude Code 實現 Logto 認證嘅全端應用程式：由登入設定到自訂登入面板同社交登入都一應俱全。
Claude Code 係由 Anthropic 開發、搭載 AI 嘅編程助手，專為協助開發者更有效率咁寫碼、除錯同理解代碼。佢唔同一般嘅 chatbot，因為佢重點針對編程工作流程，仲可以深度整合入開發環境入面。開發者可以用佢自動生成代碼片段、解釋複雜函式、修正錯誤，或者加快原型開發，都唔需要切換工作工具或分心。
Claude Code 嘅基礎來自 Anthropic 嘅 Claude 模型，訓練時強調安全、可靠同有用性。換句話講，Claude Code 唔止追求速度，仲會產生可信賴、易於維護嘅程式碼，真係適合實際項目。
市場上早已有唔少 AI 編碼助手，但 Claude Code 有幾個特別之處：
簡單講，其他工具著重補全代碼，Claude Code 希望成為理解同生成兼備嘅拍檔。
Claude Code 為多種用戶而設：
簡單黎講，只要你日常寫 code、睇 code 或管理 code，Claude Code 都可以令你開發過程更快、更清晰、更可靠。
今日我會帶大家一步一步用 Claude Code 為你嘅 app 加自訂登入體驗，無論你係專業開發者定純粹 coding 玩下都啱用。
今次例子，我用 Claude Code 寫咗個檔案管理 app。
第一步，我去咗 Logto Cloud 控制台 開咗個單頁面應用程式。你會見到有唔同設定選項同 endpoint，等陣整合時我哋就會用得著。
Claude Code 幫我自動做晒後續：佢會安裝最新 Logto React SDK、設定認證組件同串連所有部份。
根據指示，我要準備兩個關鍵資料：
我將 Logto endpoint 同 App ID 複製去專案入面，然後設定好 Redirect URI 同 Post sign-out redirect URI。
你可以直接將呢兩項傳畀 Claude Code，剩低設定就幫你自動搞掂。
依家可以測試下：撳 Sign in，你就會被帶去 Logto 嘅託管登入頁面。
如果你設咗 post sign-out URL，登出之後會自動帶返指定頁面。
Logto 提供一套可調整嘅預設登入流程，你可以喺 Console 度自訂。開頭記得去 Sign-in Experience > Sign-in & Sign-up，揀返你想俾用戶用咩方式登入（例如 email、用戶名、電話號碼或社交帳號）。
一經設定，觸發登入流程就會帶用戶去 Logto 託管嘅登入頁，同時根據你揀咗嘅選項。成個認證流程由 Logto 負責，登入後會自動帶返你個 app。
我想再進一步，打造成個自訂 floating 登入 panel，而唔係 redirect 去第二頁。我會將登入面板直接擺喺產品 UI 右下角，用戶睇住產品畫面之餘已經可以登錄，而底層都係 Logto 認證流程。
你只要用自然語言 prompt：
Claude Code 會自動生產：
用你嘅測試用戶試下，確保登入記錄到 Logto CIAM 平台。
以上都係基本用法。Logto 而家正開發 MCP server，可以直接喺你 IDE 入面運行，等你唔洗離開開發環境都可以同 Logto Console 及管理 API 互動。
有咗呢套 setup，你可以：
本地工具加埋 AI 同 Logto 基建，身份認證唔再係麻煩嘅集成步驟，而係納入你日常開發工作流程嘅一部份。