Open-Dev-Society/OpenStock View GitHub Homepage for Latest Official Releases

開源的股票市場追蹤平台，提供即時價格監控、個人化提醒和詳細的公司分析，完全免費且永久開放

AGPL-3.0TypeScriptOpenStockOpen-Dev-Society 5.5k Last Updated: October 24, 2025

OpenStock 專案介紹

專案概述

OpenStock 是一個現代化的開源股票市場應用程式，旨在為所有人提供免費、開放的市場追蹤工具。它是昂貴市場平台的開源替代方案，支援即時價格追蹤、個人化提醒和詳細的公司洞察分析。

核心理念： 知識應該是開放、免費且可存取的，技術應該屬於每個人。

主要特性

🔐 身份驗證

  • 基於 Better Auth + MongoDB 的電子郵件/密碼驗證系統
  • 透過 Next.js 中介層保護的路由
  • 完整的使用者會話管理

🔍 全域搜尋

  • 快速的股票搜尋功能，由 Finnhub API 支援
  • 閒置時顯示熱門股票，支援防抖查詢
  • Command + K 快捷鍵調出命令面板

⭐ 自選股清單

  • 每位使用者的自選股儲存在 MongoDB 中
  • 每位使用者對每個股票代碼僅能儲存一次
  • 便捷的新增/移除功能

📊 股票詳情

  • TradingView 提供的股票代碼資訊
  • K線圖/進階圖表、基準圖、技術指標
  • 公司資料與財務數據小工具

📈 市場概覽

  • 熱力圖、行情報價與頭條新聞
  • 使用 TradingView 嵌入式小工具
  • 即時市場數據更新

🎯 個人化入門流程

  • 收集使用者所在國家、投資目標
  • 風險承受能力與偏好產業
  • 定製化使用者體驗

📧 郵件與自動化

  • AI 個人化歡迎郵件（透過 Inngest 呼叫 Gemini）
  • 每日新聞摘要郵件（定時任務）
  • 基於使用者自選股的個人化內容

🎨 精緻的使用者介面

  • shadcn/ui 元件 + Radix UI 基礎元件
  • Tailwind v4 設計系統
  • 預設深色主題
  • 回應式設計

技術棧

核心技術

  • Next.js 15 (App Router)
  • React 19
  • TypeScript
  • Tailwind CSS v4 (透過 @tailwindcss/postcss)
  • shadcn/ui + Radix UI 基礎元件
  • Lucide 圖示庫

認證與資料

  • Better Auth – 電子郵件/密碼認證，搭配 MongoDB 適配器
  • MongoDB + Mongoose – 資料持久化
  • Finnhub API – 股票代碼、公司資料與市場新聞
  • TradingView – 可嵌入的圖表小工具

自動化與通訊

  • Inngest – 事件處理、定時任務、AI 推理 (Gemini)
  • Nodemailer – 郵件發送 (Gmail 傳輸)
  • next-themes – 主題切換
  • cmdk – 命令面板
  • react-hook-form – 表單處理

語言組成

  • TypeScript (~93.4%)
  • CSS (~6%)
  • JavaScript (~0.6%)

專案結構

app/
├── (auth)/                    # 認證相關頁面
│   ├── layout.tsx
│   ├── sign-in/page.tsx
│   └── sign-up/page.tsx
├── (root)/                    # 主要應用頁面
│   ├── layout.tsx
│   ├── page.tsx
│   ├── help/page.tsx
│   └── stocks/[symbol]/page.tsx
├── api/inngest/route.ts       # Inngest API 端點
├── globals.css
└── layout.tsx

components/
├── ui/                        # shadcn/radix 基礎元件
├── forms/                     # 表單元件
├── Header.tsx
├── Footer.tsx
├── SearchCommand.tsx
└── WatchlistButton.tsx

database/
├── models/watchlist.model.ts
└── mongoose.ts

lib/
├── actions/                   # 伺服器操作
│   ├── auth
│   ├── finnhub
│   ├── user
│   └── watchlist
├── better-auth/
├── inngest/                   # Inngest 客戶端與函數
├── nodemailer/               # 郵件發送設定
├── constants.ts
└── utils.ts

scripts/
└── test-db.mjs               # 資料庫連線測試

types/
└── global.d.ts

public/assets/images/         # Logo 與截圖

快速開始

前置需求

  • Node.js 20+
  • pnpm 或 npm
  • MongoDB 連接字串 (MongoDB Atlas 或本機 Docker)
  • Finnhub API 金鑰
  • Gmail 帳戶 (用於寄送郵件)
  • 選填：Google Gemini API 金鑰 (用於 AI 生成內容)

安裝步驟

  1. 複製儲存庫
git clone https://github.com/Open-Dev-Society/OpenStock.git
cd OpenStock
  1. 安裝依賴
pnpm install
# 或
npm install
  1. 設定環境變數

建立 .env 檔案：

# 核心設定
NODE_ENV=development

# 資料庫
MONGODB_URI=your_mongodb_connection_string

# Better Auth
BETTER_AUTH_SECRET=your_better_auth_secret
BETTER_AUTH_URL=http://localhost:3000

# Finnhub
FINNHUB_API_KEY=your_finnhub_key
NEXT_PUBLIC_FINNHUB_API_KEY=
FINNHUB_BASE_URL=https://finnhub.io/api/v1

# Inngest AI (Gemini)
GEMINI_API_KEY=your_gemini_api_key

# 郵件設定
NODEMAILER_EMAIL=youraddress@gmail.com
NODEMAILER_PASSWORD=your_gmail_app_password
  1. 驗證資料庫連線
pnpm test:db
  1. 啟動開發伺服器
pnpm dev
  1. 啟動 Inngest (用於工作流程與定時任務)
npx inngest-cli@latest dev
  1. 存取應用程式

開啟瀏覽器並前往 http://localhost:3000

Docker 部署

專案提供 Docker Compose 設定，可快速啟動應用程式與 MongoDB：

# 啟動 MongoDB
docker compose up -d mongodb

# 建置並啟動應用程式
docker compose up -d --build

使用 Docker 時，MongoDB 連接字串應為：

MONGODB_URI=mongodb://root:example@mongodb:27017/openstock?authSource=admin

資料與整合

Finnhub API

  • 提供股票搜尋、公司資料與市場新聞
  • 免費版本可能回傳延遲行情
  • 需注意速率限制

TradingView

  • 提供可嵌入的圖表、熱力圖、行情等小工具
  • 外部圖片來自 i.ibb.co

Better Auth + MongoDB

  • 電子郵件/密碼認證
  • MongoDB 適配器用於會話儲存
  • 大多數路由受保護，僅登入/註冊頁面除外

Inngest 工作流程

  • 使用者建立事件 → AI 個人化歡迎郵件
  • 定時任務 (每日中午12點) → 發送新聞摘要郵件
  • 本機開發使用 npx inngest-cli@latest dev

郵件發送 (Nodemailer)

  • 使用 Gmail 作為傳輸方式
  • 提供歡迎郵件與新聞摘要範本
  • 建議生產環境使用專業 SMTP 服務

可用腳本

  • pnpm dev – 啟動開發伺服器 (Turbopack)
  • pnpm build – 生產環境建置
  • pnpm start – 啟動生產伺服器
  • pnpm lint – 執行 ESLint
  • pnpm test:db – 驗證資料庫連線

開發者體驗

  • TypeScript 嚴格模式
  • Tailwind CSS v4 (無需額外設定檔)
  • shadcn/ui 元件庫
  • cmdk 命令面板
  • next-themes 主題切換
  • lucide-react 圖示

Open Dev Society 宣言

我們生活在一個知識被付費牆隱藏的世界，工具被鎖在訂閱服務中，資訊被偏見扭曲，新手被告知他們「不夠好」無法構建。

我們的信念：

  • 技術應該屬於每個人
  • 知識應該是開放、免費且可存取的
  • 社群應該以信任而非門檻來歡迎新手

我們的使命：

  • 構建真正有用的免費開源專案
  • 讓專業人士與學生皆可無障礙使用的工具
  • 學習永遠免費的知識平台
  • 引導而非評判初學者的社群
  • 基於信任而非利潤運作的資源

我們的承諾：

  • 永遠不會封鎖知識
  • 永遠不會收取存取費用
  • 永遠不會用信任交換金錢
  • 在透明度、捐贈與社群力量的基礎上運作

貢獻指南

歡迎所有人貢獻！無論你是學生、自學開發者還是資深工程師。

  • 透過 Issue 討論想法與 Bug
  • 尋找標記為 "good first issue" 或 "help wanted" 的問題
  • 保持 PR 專注，UI 變更請附上截圖
  • 友善待人，引導初學者，拒絕門檻 — 這就是 ODS 之道

安全性

若發現安全漏洞：

  • 請勿公開提交 Issue
  • 寄送電子郵件至：opendevsociety@cc.cc
  • 我們將協調負責任的揭露並迅速修補

授權條款

OpenStock 採用 AGPL-3.0 授權條款。若您修改、重新分發或部署此專案（包括作為 Web 服務），您必須在相同授權條款下發布您的原始碼並註明原作者。

致謝

  • Finnhub – 提供可存取的市場資料
  • TradingView – 提供可嵌入的市場小工具
  • shadcn/ui, Radix UI, Tailwind CSS, Next.js 社群
  • Inngest – 可靠的後台任務與工作流程
  • Better Auth – 簡單安全的認證
  • 所有讓開源工具成為可能的貢獻者

特別感謝 Adrian Hajdin (JavaScript Mastery)，他出色的股票市場應用程式教學為 Open Dev Society 構建 OpenStock 提供了重要幫助。

構建於開放，為每個人，永遠免費。—— Open Dev Society

專案網址：https://github.com/Open-Dev-Society/OpenStock

Star History Chart