PnL 성과 차트
기간별 손익 곡선을 인터랙티브 라인 차트로 시각화.
개발 중2025Web3 · 데이터 대시보드
CryptoTrade.gg
암호화폐 트레이드 전적을 데이터로 증명
거래소 트레이드 기록을 불러와 승률·손익(PnL)·자산 배분을 시각화하는 크립토 트레이딩 대시보드. 트레이더의 전적을 한 페이지에 정리해 데이터로 실력을 보여주는 op.gg 스타일 서비스입니다.
●cryptotrade.gg / dashboardLIVE
Problem
“나 트레이딩 잘해”를 증명할 방법이 없었다
트레이더의 실력은 스크린샷 몇 장으로 남습니다. 수익 인증은 조작하기 쉽고, 손실은 조용히 사라지죠. 거래소마다 흩어진 체결 내역은 승률도, 진짜 수익률도 말해주지 않습니다. CryptoTrade.gg는 거래 데이터 그 자체로 전적을 증명합니다. op.gg가 게임 실력을 보여주듯, 트레이딩 실력을 데이터로.
액티브 트레이더
흩어진 거래소 기록을 한곳에서 객관적으로 리뷰하고 싶은 사람
전적을 공유하려는 트레이더
스크린샷이 아닌 검증 가능한 데이터로 실력을 보여주려는 사람
데이터로 개선하려는 사람
승률·손익·자산 배분을 지표로 보고 전략을 다듬으려는 사람
Features
트레이딩 터미널처럼 날카로운 데이터 대시보드
손익 곡선부터 자산 배분까지, 트레이더가 매일 확인하는 지표를 한 화면에 밀도 있게 담았습니다.
승률 · ROI 카드
승률·총 수익률·거래 횟수 등 핵심 지표를 카운트업으로 강조.
자산 배분 테이블
보유 토큰별 비중과 성과를 테이블로 한눈에.
데이터 중심 대시보드
트레이딩 터미널처럼 날카로운 다크 UI와 데이터 밀도.
Showcase
데이터가 곧 화면이 되는 대시보드
코드로 그린 라이브 위젯과 실제 대시보드 목업을 나란히. 모든 숫자는 데모용 예시입니다.
PnL · 12W
+142%
Now
+142%
Win Rate
0%847승 / 398패
▲ 847 WIN▼ 398 LOSS
Allocation
5 assetsAssetWeight24h
- BTCBitcoin42%+18.2%
- ETHEthereum28%+9.4%
- SOLSolana14%-4.1%
- ARBArbitrum9%+23.7%
- USDCUSD Coin7%+0.2%
portfolio · overview
Tech Stack
역할별로 정리한 기술 구성
데이터 시각화 프론트엔드와 온체인·거래소 데이터 연동을 중심으로 구성했습니다.
Framework
Next.js
Language
TypeScript
Styling
Tailwind CSS
Charts
Recharts
Web3
Web3
Impact
구현한 것과 배운 것
아래 수치는 데이터 시각화 역량을 보여주기 위한 데모 예시입니다. 실제 운영 지표가 아니라, 어떤 규모의 데이터를 다루도록 설계했는지를 나타냅니다.
0
분석한 거래
거래소 체결 내역을 정규화해 집계
0%
평균 승률
진입·청산 페어를 매칭해 산출
+0%
누적 ROI
기간 누적 손익률 (12주)
0
추적 자산
멀티 체인·거래소 토큰 커버리지
데이터 인제스트 엔진
거래소 API의 서로 다른 체결 스키마를 하나의 정규화 모델로 매핑하고, 페어링·수수료·펀딩까지 반영해 신뢰할 수 있는 손익을 계산합니다.
시각화 파이프라인
Recharts와 커스텀 SVG를 함께 써서 PnL 곡선·승률 링·자산 배분을 렌더링. 라이트/다크 양쪽에서 대비를 지키며 밀도 높은 지표를 표현했습니다.
Web3 데이터 연동
온체인 지갑과 거래소 데이터를 함께 다루기 위한 어댑터 구조를 설계해, 새로운 소스를 붙일 때 시각화 레이어는 그대로 재사용합니다.
CryptoTrade.gg
트레이딩 전적을
데이터로 증명하세요
승률·손익·자산 배분을 한 페이지에. 코드와 설계 과정이 궁금하다면 저장소를, 다른 작업이 궁금하다면 프로젝트 목록을 확인해보세요.
CryptoTrade.gg © 2025 toris-dev
GitHub