我已經看過這種模式演過十多次了。一家 Webflow 代理商登陸了一個很棒的客戶，完美地打造了行銷網站，然後聽到讓他們胃部下沉的話語：「你也能為我們構建客戶入口嗎？」或者是產品儀表板。或者是具有實時庫存的經過身份驗證的電子商務體驗。突然間，無程式碼魔法就乾涸了。

那些弄清楚下一步該做什麼的代理商每年在營收頂線增加 20 萬美元或更多。那些沒有的？他們正在轉介這項工作──並看著其他人擁有客戶關係。

我將詳細說明 Webflow 代理商如何與 Next.js 開發人員合作、實際有效的白標籤模式、收入增長背後的數學，以及如何構建這些合作關係使雙方都獲勝。這不是理論──它基於與代理商所有者的對話以及我們在 Social Animal 過去幾年建立的合作關係。

目錄

Webflow 代理商增長問題

Webflow 確實令人印象深刻。2025 年超過 60 萬個活躍網站、50% 的年同比收入增長達到 2023 年的 2 億美元，以及根據 Forrester 研究三年內 332% 的投資回報率。該平台與傳統開發相比提供了 94% 更快的頁面啟動時間。這些數字是真實的，它們創造了一整個由構建漂亮、高性能行銷網站的代理商組成的生態系統。

但這是在 Webflow Conf 上沒有人談論的事情：Webflow 專用構建的收費有一個硬上限。

大多數 Webflow 代理商項目落在 1 萬美元至 5 萬美元的範圍內。這是紮實的工作，但當你試圖擴展時，數學變得殘酷。你需要不斷的新客戶管道，你的團隊總是在項目之間切換上下文，而一旦客戶需要超出 Webflow 原生功能的東西──自訂身份驗證、複雜的資料處理、實時功能、多租戶架構──你就陷入困境了。

我看到在 2025-2026 年增長最快的代理商已經弄明白了一個簡單的真理：最有利可圖的工作發生在 Webflow 能做什麼的邊界。

這個邊界就是 Next.js 的用武之地。

為什麼 Next.js 是自然延伸

我不打算假裝 Next.js 是唯一的選擇。但對於 Webflow 代理商來說，它是最自然的選擇，原因如下。

Webflow 本質上是一個具有 CMS 的視覺前端構建器。Next.js 是一個基於 React 的框架，具有伺服器端渲染、靜態站點生成、API 路由和中間件。它們是互補的，而不是競爭的。

這樣想：

功能 Webflow 原生 Webflow + Next.js
行銷頁面 ✅ 優秀 ✅ 優秀
部落格/內容 CMS ✅ 良好 ✅ 很好（無頭）
使用者身份驗證 ❌ 有限 ✅ 完全控制
動態儀表板 ❌ 不可能 ✅ 完全控制
電子商務（複雜） ⚠️ 基礎 ✅ 自訂邏輯
API 整合 ⚠️ 透過 Zapier/Make ✅ 原生 API 路由
即時功能 ❌ 否 ✅ WebSockets、SSE
多語言（i18n） ⚠️ 變通方法 ✅ 內建支援
效能（Core Web Vitals） ✅ 良好 ✅ 使用 ISR 優秀
SEO 用於 AI/LLM 發現 ⚠️ 有限結構化資料 ✅ 完全控制

當 Webflow 客戶需要右列中的內容時，能夠提供它的代理商保留客戶。無法提供的代理商會失去他們給全套服務商。

像 Finsweet 和 BRIX 這樣的代理商已經弄明白了這一點，用自訂邏輯和技術深度擴展 Webflow。但大多數代理商員工中沒有 React 開發人員──也不應該有。這就是合作關係發揮作用的地方。

收入數學：20 萬美元/年的實現方式

讓我通過實際數字來講解，因為「每年增加 20 萬美元」聽起來像是標題黨承諾，除非我展示計算過程。

以下是一個保守的模型，適用於開始透過開發合作夥伴提供 Next.js 驅動服務的 Webflow 代理商：

場景：向現有客戶追加銷售

假設你每年有 30 個活躍的 Webflow 客戶（對於 5-10 人的代理商很標準）。其中：

  • 20%（6 個客戶）需要超出 Webflow 原生功能的東西
  • 平均 Next.js 附加項目價值：2.5 萬美元至 4.5 萬美元
  • 你在支付開發合作夥伴後的邊際利潤：40-50%

讓我們保持保守：

6 個項目 × 3.5 萬美元平均值 = 21 萬美元總收入
21 萬美元 × 45% 邊際利潤 = 9.45 萬美元利潤

這是來自你之前轉介的工作的近 10 萬美元純利潤。

場景：登陸更大的客戶

這是事情變得有趣的地方。隨著 Next.js 功能在你的名單上，你現在可以向之前會駁回 Webflow 專用代理商的客戶進行宣傳：

  • SaaS 公司需要行銷網站和類應用體驗
  • FinTech 公司需要符合 FCA 的入口以及他們的公開網站
  • 電子商務品牌需要自訂產品配置器或帳戶區域

這些項目起價 5 萬美元至 15 萬美元。除了現有工作，每年登陸其中 2-3 個項目會讓你遠遠超過 20 萬美元的額外收入。

場景：固定費用收入

一旦你為客戶構建了 Next.js 驅動的功能，他們就需要持續維護。典型的 Webflow + Next.js 混合網站固定費用每月 2,000 美元至 5,000 美元。每月 6 個客戶以 3,000 美元的固定費用是另外 21.6 萬美元/年──而固定費用收入是最有價值的那種。

有效的白標籤合作模式

並非所有合作關係都是平等的。我已經看到三種模式在實踐中發揮作用，每種都有不同的權衡。

模式 1：基於項目的白標籤

你向客戶銷售項目，然後將 Next.js 開發外包給你的合作夥伴。客戶永遠不知道另一個團隊參與其中。

優點：

  • 簡單開始
  • 沒有持續承諾
  • 你完全控制客戶關係

缺點：

  • 每個項目的協調開銷更高
  • 你負責範圍管理
  • 品質取決於合作夥伴評估

最適合： 剛開始提供開發服務的代理商。

模式 2：嵌入式團隊擴展

你的開發合作夥伴提供專門的開發人員，他們作為你團隊的一部分工作──使用你的 Slack、參加你的站立會議、以你的品牌出現。

優點：

  • 感覺像擁有內部開發人員而沒有開銷
  • 更好的溝通和背景
  • 根據需求上下擴展

缺點：

  • 更高的月度承諾
  • 需要流程對齐
  • 合作夥伴需要符合你的文化

最適合： 具有一致開發需求的代理商（每季度 3 個以上項目）。

模式 3：混合收入分享

你和你的開發合作夥伴共同銷售和交付，根據貢獻分割收入。客戶可能知道雙方存在。

優點：

  • 共享風險和銷售努力
  • 獲得合作夥伴網路的新線索
  • 較低的前期成本

缺點：

  • 對客戶關係的控制較少
  • 需要明確的責任協議
  • 沒有好的合同可能變得混亂

最適合： 與著名開發工作室合作的代理商。

在 Social Animal，我們與代理商合作夥伴運行了所有三種模式。嵌入式團隊擴展傾向於為年收入 50 萬美元以上的代理商產生最佳結果，而基於項目的對於測試水域的小型商店效果很好。

技術整合：Webflow 和 Next.js 如何協作

讓我進入技術細節，因為這是許多代理商對實際可能的事情感到困惑的地方。

架構 1：Webflow CMS 作為無頭後端

Webflow 的 CMS API 允許你將內容拉入 Next.js 前端。你的行銷團隊繼續在 Webflow 的視覺編輯器中編輯內容，但實際渲染透過 Next.js 進行。

// 在 Next.js 中獲取 Webflow CMS 集合
export async function getStaticProps() {
  const res = await fetch(
    'https://api.webflow.com/v2/collections/{collection_id}/items',
    {
      headers: {
        'Authorization': `Bearer ${process.env.WEBFLOW_API_TOKEN}`,
        'accept': 'application/json',
      },
    }
  );
  const data = await res.json();

  return {
    props: { items: data.items },
    revalidate: 60, // ISR：每 60 秒重建一次
  };
}

這種方法結合了 Webflow 的編輯體驗與 Next.js 的渲染能力。ISR（增量靜態再生）意味著你的頁面閃電般快速但始終新鮮。

架構 2：用於行銷的 Webflow，用於應用的 Next.js

更常見的模式。客戶的行銷網站保留在 Webflow（它在這方面很擅長），而 Next.js 處理經過身份驗證/動態的部分：

  • www.client.com → Webflow（行銷頁面、部落格、登陸頁面）
  • app.client.com → Next.js（儀表板、入口、帳戶區域）
  • 共享設計系統確保視覺一致性

這是無頭 CMS 開發方法真正閃閃發光的地方。你不是在選擇平台之間──你在每個地方使用最強大的工具。

架構 3：具有 Webflow 設計 DNA 的完整 Next.js

一些代理商匯出他們的 Webflow 設計並在 Next.js 中重建它們，使用 Devlink 等工具或手動轉換設計系統。在以下情況下這是有意義的：

  • 整個網站需要 SSR/SSG 以獲得性能
  • 你需要對結構化資料的精細控制以進行 AI/LLM 發現
  • 客戶的網站高度動態，具有個性化

我們的 Next.js 開發團隊已處理所有三種架構。正確的選擇取決於客戶的特定需求，而不是一個統一的理念。

尋找和評估 Next.js 開發合作夥伴

這是代理商搞砸最多的地方。他們在 Upwork 上找到某人，在第一個項目中被燒傷，並決定合作關係不起作用。以下是如何真正評估合作夥伴。

尋找的內容

  1. 生產 Next.js 經驗──而不僅僅是教程。要求查看他們構建的活躍網站。檢查他們的 Lighthouse 分數。
  2. Webflow 熟悉度──他們需要了解 Webflow 的 CMS 資料模型和 API 怪癖。如果當你提到 CMS 集合時他們看起來很茫然，繼續尋找。
  3. 溝通節奏──白標籤工作需要密切溝通。你的合作夥伴需要主動更新你，而不是等著你提問。
  4. 設計敏感度──運送像素完美工作的開發人員很少見。用你的設計團隊驗證。
  5. 流程文件──他們如何處理範圍變更？QA？部署？如果他們不能清楚地說明這一點，他們會臨時抱佛腳。

紅旗

  • 他們從未與非技術客戶合作過（你將成為翻譯者──這需要有效）
  • 沒有 TypeScript 經驗（在 2025 年，這對於可維護的程式碼是不可談判的）
  • 他們無法解釋他們的託管/部署建議
  • 沒有結構化的項目交接或文件方法

試用項目

始終以小項目開始。一個互動式元件、具有動態資料的登陸頁面或概念驗證客戶功能。為此試用預算 3,000 美元至 5,000 美元。這是你將進行的最便宜的盡職調查。

2025-2026 年的真實定價基準

以下是市場現在的實際情況，基於我們看到和定價的項目：

項目類型 客戶價格範圍 開發合作夥伴成本 你的邊際利潤
自訂互動式元件 5K-15K 美元 2K-7K 美元 45-55%
經過身份驗證的入口/儀表板 25K-75K 美元 12K-35K 美元 45-55%
完整混合網站（Webflow + Next.js） 40K-120K 美元 20K-55K 美元 45-55%
具有自訂邏輯的電子商務 35K-80K 美元 15K-40K 美元 45-55%
持續固定費用（月度） 3K-8K 美元/月 1.5K-4K 美元/月 50%

45-55% 的邊際利潤對於白標籤開發是典型的。你提供客戶關係、項目管理、設計方向和品質保證。這值很多錢。

對於有興趣探索這些合作關係在實踐中的樣子的代理商，我們的定價頁面詳細說明了我們如何構建參與。或者直接聯絡我們──我們很樂意討論這個模型。

常見的陷阱以及如何避免

陷阱 1：在能夠交付之前銷售

在你的合作關係經過測試之前，不要向客戶承諾 Next.js 功能。我看過代理商簽署 8 萬美元的合同，然後匆匆尋找開發人員。那是災難的配方。

修復： 在向客戶銷售之前，至少完成一個與你的開發合作夥伴的試用項目。

陷阱 2：範圍預期不對齐

你的客戶告訴你他們想要「一個簡單的登錄頁面」。你告訴你的開發合作夥伴「構建一個登錄頁面」。他們構建了一個基本的身份驗證表單。客戶實際上想要帶有 Google 的 SSO、基於角色的存取控制和密碼恢復流。

修復： 你的開發合作夥伴應該參與範圍界定流程，即使客戶不知道他們的存在。在你報價之前，讓他們審查要求並標記複雜性。

陷阱 3：沒有共享設計系統

Webflow 行銷網站看起來很漂亮。Next.js 入口看起來……不同。客戶注意到。

修復： 將你的 Webflow 設計令牌（顏色、排版、間距、元件）提取到一個共享系統中。你的開發合作夥伴應該在 React 中實現這些作為元件庫。這也是Astro 開發對於需要最大性能的內容豐富混合網站有趣的地方。

陷阱 4：忽視後啟動支援

你啟動了混合網站，高舉一圈，然後……誰處理錯誤報告？誰部署 CMS 變更以破壞 Next.js 整合？

修復： 在項目開始之前，與你的開發合作夥伴定義支援 SLA。將其包含在客戶的固定費用定價中。

陷阱 5：嘗試自己學習 Next.js

我看過代理商創始人花六個月時間試圖學習 React 和 Next.js，以便他們可以「自己做」。那是六個月他們沒有花在銷售、設計和客戶關係上──真正賺錢的事情。

修復： 專注於你擅長的事情。為其他事物與專家合作。這不是弱點。這是每個成功代理商擴展規模的方式。

常見問題

Webflow 代理商開始透過合作夥伴提供 Next.js 服務需要花費多少錢？ 你的初始投資主要在於尋找和評估合作夥伴。為試用項目預算 3,000 美元至 5,000 美元，加上 10-15 小時時間進行合作夥伴評估和流程對齐。沒有許可成本──Next.js 是開源的。大多數代理商在第一個或第二個客戶項目中看到正投資回報率。

Webflow 和 Next.js 真的能在同一個項目上協作嗎？ 絕對。最常見的模式是使用 Webflow 進行行銷頁面和 CMS 內容，而 Next.js 處理經過身份驗證的體驗、動態功能或效能關鍵頁面。Webflow 的 CMS API 允許 Next.js 直接拉入內容，子域路由允許你從統一域名提供兩者。這是由數百個生產網站使用的經過驗證的架構。

哪些類型的客戶項目最受益於 Webflow + Next.js 混合方法？ B2B SaaS 公司需要行銷網站和類應用客戶入口。FinTech 公司需要符合合規的經過身份驗證的體驗。具有複雜產品配置器或帳戶管理的電子商務品牌。任何超出 Webflow 原生功能但喜歡行銷內容編輯體驗的客戶。

我如何向非技術客戶解釋這種混合方法？ 保持簡單：「我們為網站的每個部分使用最好的工具。你的行銷頁面使用你的團隊可以直接編輯的視覺平台。你的[入口/儀表板/應用]使用自訂開發來獲得需要它的功能。兩者對訪問者看起來和感覺都是相同的。」客戶不關心技術──他們關心結果。

Webflow 代理商從開始探索這個想法到交付他們的第一個混合項目通常需要多長時間？ 大多數代理商可以在「探索想法」到「交付他們的第一個混合項目」之間的 8-12 週內完成。這包括合作夥伴評估（2-3 週）、試用項目（3-4 週）和登陸及範圍確定他們的第一個真實客戶參與（3-5 週）。來自該第一個項目的收入通常在開始流程的 4-5 個月內到達。

我應該招聘 Next.js 開發人員而不是與合作夥伴合作嗎？ 取決於你的交易量。高級 Next.js 開發人員在美國成本 12 萬美元至 18 萬美元/年（薪資加福利），或遠端強勢招聘 6 萬美元至 9 萬美元。如果你有持續需求 3 個或更多並發項目，這是有意義的。對於大多數 Webflow 代理商開始時，合作夥伴模式消除了固定成本風險，並允許你根據需求上下擴展。一旦你驗證了收入流，你總是可以將人們帶入內部。

Webflow 代理商在白標籤 Next.js 工作中可以期望什麼邊際利潤？ 健康的合作關係為代理商產生 40-55% 的毛邊際利潤。你提供項目管理、客戶溝通、設計方向、QA 和客戶關係本身。一些代理商透過在內部進行更多的設計到程式碼交接工作來推動更高的邊際利潤。關鍵是與合作夥伴透明化定價──他們應該知道你的客戶費率，你應該知道他們的成本。

Webflow 代理商在白標籤開發工作時如何保持品質？ 三件事：一個具有記錄的令牌和元件的共享設計系統、一個結構化的品質保證流程，你的團隊在客戶看到之前審查每個部署，以及定期的同步會議（在活躍項目期間至少每週兩次）。白標籤品質陷入困境的代理商通常是那些將 Figma 檔案丟過牆而希望最好的代理商。參與流程而不微管理程式碼。