# 策展 · X (Twitter) 🔥
> 📖 本站完整內容索引（documentation index）：[llms.txt](/llms.txt)
> 作者：Pontus Abrahamsson — oss/acc (@pontusab) · 平台：X (Twitter) · 日期：2026-06-05
> 原始來源：https://x.com/pontusab/status/2062541046475812915
## 中文摘要
Pontus Abrahamsson 發布 Behind the Code 打造自託管平台。
**核心理念與定位**
Pontus Abrahamsson 旨在為創作者提供一個擺脫大型平台限制的解決方案，讓創作者能擁有自己的品牌、影片與訂閱者。與其說這是一個社群網站，不如說它更像是一個「Netflix 風格」的品牌頻道，專注於單一發布者的內容呈現。該平台強調「無鎖定」（No lock-in）原則，使用者可以隨時 Fork 程式碼並根據需求進行客製化。
> 「Behind the Code」是一個以深色模式設計的開源軟體影片平台，提供工程、產品與文化相關的教學內容。
**開箱即用的功能**
該平台提供了一套完整的影片發布與管理工具，包含：
- 具備分類功能的公開網站，支援付費牆（paywalled）影片與課程。
- 由 Mux 驅動的串流播放、字幕與數據分析功能。
- 整合 Supabase 進行身分驗證（支援 email、OAuth、magic link）。
- 透過 Polar 處理訂閱與單次購買。
- 支援在 Vercel 上一鍵部署。
**技術架構**
「Behind the Code」採用現代化的技術堆疊，確保效能與開發體驗：
- **框架與語言**：Next.js 16（App Router、Cache Components）、React 19.2、TypeScript。
- **基礎設施**：Vercel（託管、分析、防機器人）、Supabase（Postgres 資料庫、Auth、Storage）。
- **影片處理**：Mux（上傳、播放、簽名播放、Mux Data）。
- **介面與編輯**：Tailwind v4、shadcn UI 元件、Tiptap（Markdown/MDX 編輯）。
- **專案結構**：採用 Turborepo 與 Bun workspaces 的 Monorepo 架構，將資料庫、Mux 客戶端、UI 設計系統與應用程式邏輯模組化。
**部署與啟動步驟**
開發者可透過以下方式快速啟動專案：
1. 本地開發環境：
```bash
bun install
supabase start
cp .env.example .env.local
bun run seed
bun run dev
```
2. 部署至生產環境：
- 建立 Supabase 專案並透過 `supabase db push` 推送 schema。
- 將專案匯入 Vercel，設定 Root Directory 為 `apps/web`。
- 配置必要的環境變數（Core 變數為必填，其餘如 Polar、AI 審核為選填）。
- 設定 Mux Webhook 與 Vercel Cron（用於排程發布）。
- 首次部署後，第一個註冊的帳號將自動成為管理員。
**實際應用與管理**
根據後台介面展示，該平台具備完整的 CMS 功能，包括總觀看次數監控、熱門影片排行榜、類別管理、評論審核以及詳細的影片編輯器（支援排程發布與縮圖管理）。創作者可透過後台設定網站名稱、強調色、主題與各項整合服務，實現高度自主的內容經營。更多詳細資訊與程式碼可參考 [Behind the Code GitHub 專案](https://github.com/pontusab/behindthecode) 或官方網站 [behindthecode.dev](https://behindthecode.dev)。
> 這是一個影片內容管理平台的後台儀表板，展示了數據分析、影片列表、類別管理、用戶權限及系統設定等功能。
## 標籤
開源專案, 新產品, Web, Behind the Code, Pontus Abrahamsson