Live cryptocurrency trades visualizer.
Currently supporting BitMEX, Bitfinex, Binance & Binance Futures, Gdax, Bitstamp, Deribit, Huobi, Okex, Hitbtc, Poloniex, Bybit and FTX (see src/exchanges/ for detail)
This tool shows markets orders filling limit orders LIVE on the crypto markets.
- Show LIVE trades from exchanges on a specific pair (default BTCUSD)
- Filter noise by aggregating trades with the same timestamp (timeout based aggregation)
- Chart averaged price, buy & sell volume, price sma, volume ema (lightweight-chart was used)
- Play audio when trade show up based on volume
- Scroll through historical data (when available)
Checkout CHANGELOG.md for details about the recent updates.
The app is written in Vue.js, use the javascript WebSocket interface to connect to the exchanges API and listen to the trades events. The raw trades are then dispatched to the chart component, while it aggregate trades for the list component. Periodically a summary of market activity (volume, counts and liquidations) is sent to the stats & counters components.
- Clone the repo
git clone https://github.com/Tucsky/SignificantTrades- Install dependencies
npm install- Run dev mode
Dev mode is
npm run serveThis will automatically open a browser window at localhost:8080
Otherwise can build the application
npm run buildand access the dist/index.html directly in the browser later without having to run a command
...
- Profit !
SignificantTrades is now using Vue Cli which allows you to configure the client using .env file.
Create a .env.local or .env.development or .env.production file inside / folder.
| key | description | example value |
|---|---|---|
| PROXY_URL | what proxy url to use when fetching data from exchange's REST APIs | http://localhost:8080/ |
| API_URL | define main historical endpoint | http://192.168.0.50:3000/{pair}/historical/{from}/{to}/{timeframe} |
| API_SUPPORTED_PAIRS | define when app should be trying to fetch historical data depending on selected pair | BTCUSD, ETHUSD |
You can use this project without historical data just by opening the app in your browser, as getting trades from exchanges is made directly in the browser using websocket api.
However, in order to show historical data you will need to setup your own server that will collect and distribute data on demand.
The current code for the server part is located in the feature/server branch.
Let's say you have a server instance running on port 3000, start the client with an environment variable API_URL=http://localhost:3000/{pair}/historical/{from}/{to}/{timeframe} npm run serve.
BTC 3PK1bBK8sG3zAjPBPD7g3PL14Ndux3zWEz XMR 48NJj3RJDo33zMLaudQDdM8G6MfPrQbpeZU2YnRN2Ep6hbKyYRrS2ZSdiAKpkUXBcjD2pKiPqXtQmSZjZM7fC6YT6CMmoX6