BTC/USDT Real-time Trading View

바이낸스 API를 활용한 실시간 비트코인 트레이딩 뷰 웹 애플리케이션입니다.

주요 기능

차트 기능

• 실시간 차트: 바이낸스 WebSocket을 통한 실시간 캔들스틱 차트
• 다양한 타임프레임: 1분, 5분, 15분, 1시간, 4시간, 1일, 1주, 1월
• 기술적 지표:
  • 이동평균선 (MA5, MA20, MA60, MA120, MA200)
  • 볼린저 밴드 (20, 2)
  • MACD (12, 26, 9)
  • RSI (14)
  • 스토캐스틱 (14, 3, 3)
  • 골든크로스/데드크로스 표시
• 실시간 분석 패널: 각 지표별 매수/매도 신호 및 한글 분석 요약

경제 일정 캘린더

• 실시간 경제 일정: 주요 경제 이벤트 표시 (미국, 일본, 중국)
• 헤더 오늘 일정: 오늘의 주요 경제 일정을 헤더에 표시
• 월간 캘린더: 월별 경제 일정 캘린더 뷰
• 국가별 필터: 국가별 필터링 기능
• 중요도 표시: 이벤트 중요도에 따른 시각적 구분 (★★★)
• 더보기 모달: 일정이 많은 날짜의 상세 보기

기술 스택

• Vanilla JavaScript (프레임워크 없음)
• Lightweight Charts by TradingView
• Binance WebSocket API
• n8n (경제 일정 데이터 수집)
• Docker + Nginx

로컬 실행

# 간단한 HTTP 서버로 실행
npx http-server -p 3000

# 브라우저에서 접속
open http://localhost:3000

Docker 배포

빌드 및 실행

# 이미지 빌드 및 컨테이너 실행
docker-compose up -d --build

# 로그 확인
docker-compose logs -f

# 중지
docker-compose down

Caddy + Authentik 연동

Caddyfile.example 파일을 참고하여 Caddy 설정에 추가하세요.

trading.yourdomain.com {
    forward_auth authentik-server:9000 {
        uri /outpost.goauthentik.io/auth/caddy
        copy_headers X-Authentik-Username X-Authentik-Groups X-Authentik-Email
        trusted_proxies private_ranges
    }
    reverse_proxy bini-trading-view:80
}

자세한 Authentik 설정 방법은 Caddyfile.example 파일 내 주석을 참고하세요.

경제 일정 설정

경제 일정 데이터는 n8n 워크플로우를 통해 Forex Factory에서 수집됩니다.

데이터 소스

• Forex Factory JSON: https://nfs.faireconomy.media/ff_calendar_thisweek.json
• 제공 범위: 이번 주 경제 일정
• 필터링: US, JP, CN 국가의 Medium/High 중요도 이벤트만

n8n 워크플로우 설정

1. n8n에서 n8n/economic-calendar-combined.json 워크플로우 import
2. Header Auth Credential 설정 (API 키)
3. 워크플로우 활성화

자세한 설정 방법은 n8n/README.md를 참고하세요.

API 인증

경제 일정 API는 Header Auth로 보호됩니다:

• 헤더: X-API-Key
• app.js의 apiKey 값과 n8n Credential의 Header Value가 일치해야 합니다

프로젝트 구조

bini-trading-view/
├── index.html              # 메인 HTML
├── styles.css              # 스타일시트
├── app.js                  # 메인 애플리케이션 로직
├── indicators.js           # 기술적 지표 계산 함수
├── Dockerfile              # Docker 이미지 정의
├── docker-compose.yml      # Docker Compose 설정
├── nginx.conf              # Nginx 설정
├── Caddyfile.example       # Caddy + Authentik 설정 예시
├── data/                   # 로컬 데이터 파일
│   └── economic-calendar.json
└── n8n/                    # n8n 워크플로우 파일
    ├── README.md           # n8n 설정 가이드
    └── economic-calendar-combined.json

스크린샷

라이선스

MIT License