오픈소스 주식 시장 추적 플랫폼으로, 실시간 가격 모니터링, 맞춤형 알림, 상세한 기업 분석을 제공하며 완전 무료이며 영구적으로 개방되어 있습니다.

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에서 제공하는 종목 정보
  • 캔들차트/고급 차트, 베이스라인 차트, 기술적 지표
  • 기업 프로필 및 재무 데이터 위젯

📈 시장 개요

  • 히트맵, 시세 견적 및 주요 뉴스
  • 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/         # 로고 및 스크린샷

빠른 시작

사전 요구 사항

  • 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 기반 맞춤형 환영 이메일
  • 스케줄링 작업 (매일 정오) → 뉴스 요약 이메일 발송
  • 로컬 개발 시 npx inngest-cli@latest dev 사용

이메일 전송(Nodemailer)

  • Gmail을 전송 방식으로 사용
  • 환영 이메일 및 뉴스 요약 템플릿 제공
  • 프로덕션 환경에서는 전문 SMTP 서비스 사용 권장

사용 가능한 스크립트

  • pnpm dev - 개발 서버 시작(Turbopack)
  • pnpm build - 프로덕션 빌드
  • pnpm start - 프로덕션 서버 시작
  • pnpm lint - ESLint 실행
  • pnpm test:db - 데이터베이스 연결 확인

개발자 경험

  • TypeScript 엄격(strict) 모드
  • Tailwind CSS v4(별도 설정 파일 불필요)
  • shadcn/ui 컴포넌트 라이브러리
  • cmdk 명령 패널
  • next-themes 테마 전환
  • lucide-react 아이콘

Open Dev Society 선언문

우리는 지식이 유료 장벽 뒤에 숨겨지고, 도구가 구독 서비스에 갇히며, 정보가 편향으로 왜곡되고, 초보자들이 "너희는 만들기에 충분하지 않다"는 말을 듣는 세상에 살고 있습니다.

우리의 신념:

  • 기술은 모든 사람의 것이 되어야 합니다.
  • 지식은 열려 있고, 무료이며 접근 가능해야 합니다.
  • 커뮤니티는 장벽이 아닌 신뢰로 초보자를 환영해야 합니다.

우리의 사명:

  • 진정으로 유용한 무료 오픈소스 프로젝트를 만듭니다.
  • 전문가와 학생 모두가 장벽 없이 사용할 수 있는 도구를 제공합니다.
  • 언제나 무료로 학습할 수 있는 지식 플랫폼을 구축합니다.
  • 초보자를 판단하지 않고 안내하는 커뮤니티를 조성합니다.
  • 이익이 아닌 신뢰를 기반으로 운영되는 자원을 만듭니다.

우리의 약속:

  • 결코 지식을 잠그지 않습니다.
  • 결코 접근에 비용을 청구하지 않습니다.
  • 결코 신뢰를 돈으로 바꾸지 않습니다.
  • 투명성, 기부 및 커뮤니티의 힘을 기반으로 운영됩니다.

기여 가이드

모든 분들의 기여를 환영합니다! 학생이든, 독학 개발자이든, 숙련된 엔지니어이든 상관없습니다.

  • 이슈(Issue)를 통해 아이디어와 버그를 논의하세요.
  • "good first issue" 또는 "help wanted"로 표시된 문제를 찾아보세요.
  • PR은 집중적으로 작성하고, UI 변경 사항은 반드시 스크린샷을 첨부해 주세요.
  • 친절하게 대하고, 초보자를 안내하며, 장벽을 거부하세요 — 이것이 ODS의 방식입니다.

보안

보안 취약점을 발견한 경우:

  • 공개적으로 이슈를 제출하지 마세요.
  • 다음 이메일로 연락 주세요: opendevsociety@cc.cc
  • 책임 있는 공개를 조율하고 신속히 패치하겠습니다.

라이선스

OpenStock은 AGPL-3.0 라이선스를 따릅니다. 본 소프트웨어를 수정하거나 재배포하거나(웹 서비스로 제공 포함) 배포하는 경우, 반드시 동일한 라이선스 하에 소스 코드를 공개하고 원 저작자를 명시해야 합니다.

감사의 말

  • 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