Sign inSign up

labarrem/crypto-dashboard-ui

By labarrem

•Updated 7 months ago

Simple crypto currencies dashboard. It's the UI part of project crypto-dashboard.

Image
Internet of things
Monitoring & observability
0

1.2K

labarrem/crypto-dashboard-ui repository overview

⁠crypto-dashboard

⁠Image tag

Please use the stable tag.

⁠Github reference

This image is built from Github project mlabarre/crypto-dashboard⁠

⁠Overview

This project helps me manage my cryptocurrency transactions a little more efficiently.

It's really an unpretentious tool but if it can help others....

After entering my history since 2017 (big job !), I can now enter my transactions as they happen which greatly simplifies monitoring.

In addition to this project, my other crypto-updater project will be necessary to obtain the latest crypto prices using the coingecko APIs. These are the only internet access.

In addition, no data such as the address of your wallets is entered. On the other hand, you have the possibility when creating a transaction to provide the transaction identifier and thus have the possibility of accessing it via the appropriate blockchain.

Associated with the crypto-updater project, crypto-dashboard allows:

  • manage the platforms/wallets to use,
  • enter transactions as they occur, view them, delete or modify them,
  • to have a multi-platform/portfolio,
  • to see the evolution of cryptos (at 5mn, 1h, 1 day and 1 week),
  • define alerts,
  • to monitor cryptos that you have not yet purchased.
  • to access token charts and possibly explorers.

As a user of the Binance platform, among others, I have implemented the possibility of entering almost automatically all trades made with the *USDT and *BNB pairs.

The project use

  • API coingecko
  • API geckoterminal
  • API binance
  • Graph library of TradingView

⁠Installation

The first thing to do is to choose the base directory for the installation. Let's call it CRYPTO_HOME.

In a terminal, enter the following commands:

CRYPTO_HOME=<directory that was chosen>
mkdir -p $CRYPTO_HOME/dashboard
mkdir -p $CRYPTO_HOME/dashboard/icons
mkdir -p $CRYPTO_HOME/dashboard/mongodb
mkdir -p $CRYPTO_HOME/dashboard/config

In <CRYPTO_HOME>/dashboard/config create a file named default.json with the following content (content visible in GitHub https://github.com/mlabarre/crypto-dashboard.git⁠ file demo/default.json):

{
    "language": "fr",
    "timezone": "Europe/Paris",
    "fiat_currency" : "EUR",
    "fiat_symbol": "€",
    "decimal_separator": ",",
    "coingecko_currency" : "eur",
    "mongodb_uri" : "mongodb://mongo:27017/?serverSelectionTimeoutMS=3000&directConnection=true",
    "mongodb_database": "crypto",
    "server_port" : 8080,
    "refresh_in_seconds" : 120,
    "coingecko_coins_url": "https://api.coingecko.com/api/v3/coins/list",
    "coingecko_quotation_url": "https://api.coingecko.com/api/v3/simple/price",
    "coingecko_chart_api": "https://api.coingecko.com/api/v3/coins/TOKEN/market_chart?vs_currency=CURRENCY&days=DAYS",
    "geckoterminal_networks_url": "https://api.geckoterminal.com/api/v2/networks?page=",
    "geckoterminal_quotation_url": "https://api.geckoterminal.com/api/v2/simple/networks/NETWORK/token_price/",
    "notification_ntfy_url": "https://ntfy.sh",
    "notification_ntfy_topic": ".......",
    "chain_explorers": [
    {
      "name": "Binance BSC",
      "url": "https://bscscan.com/tx/"
    },
    {
      "name": "Bitcoin",
      "url": "https://blockstream.info/tx/"
    },
    {
      "name": "Cosmos",
      "url": "https://www.mintscan.io/cosmos/tx/"
    },
    {
      "name": "Ethereum",
      "url": "https://etherscan.io/tx/"
    },
    {
      "name": "Optimism",
      "url": "https://optimistic.etherscan.io/tx/"
    },
    {
      "name": "Polygon",
      "url": "https://polygonscan.com/tx/"
    },
    {
      "name": "Solana",
      "url": "https://solscan.io/tx/"
    },
    {
      "name": "XRP",
      "url": "https://bithomp.com/explorer/"
    }
  ],
  "platforms_api": {
    "binance": {
      "api_key": "<BINANCE_API-KEY>",
      "secret_key": "<BINANCE_SECRET-KEY>",
      "withdraw_list_url": "https://api.binance.com/sapi/v1/capital/withdraw/history",
      "payments_list_url": "https://api.binance.com/sapi/v1/fiat/payments",
      "convert_url": "https://api.binance.com/sapi/v1/convert/tradeFlow",
      "trades_histo_url": "https://api.binance.com/api/v3/myTrades"
    },
    "coinbase": {
      "api_key": "<COINBASE_API_KEY>",
      "secret_key": "<COINBASE_PRIVATE_KEY",
      "host": "api.coinbase.com",
      "accounts_path": "/v2/accounts"
    },
    "bitpanda": {
      "api_key": "<BITPANDA_API_KEY>",
      "base_url": "https://api.bitpanda.com/v1"
    }
  }
}
variableDescription
languageLanguage used: fr (French) or en (English) only.
timezoneTime zone as Europe/Paris
fiat_currencyThis is the Fiat currency (here EUR) with which you buy your cryptos. This can be EUR, USD, GBP, etc.
fiat_symbolSymbol of currency above. This can be €, $, £, etc...
decimal_separatorDecimal separator character
coingecko_currencyCurrency relative to coingecko. It must be recognized by coingecko: eur, usd, gbp, etc.
coingecko_coins_uriAPI to get the list of all cryptos (called once a day)
coingecko_quotation_uriAPI to obtain the quotations of the cryptos used (called once every 5 minutes)
geckoterminal_quotation_urlURL to access crypto prices from geckoterminal. Don't change anything.
mongodb_uriThis is the connection URL to the mongodb server. Don't change anything.
mongodb_databaseName you want to give to the mongo database. Here it is crypto.
server_portNode server listening port. Here 8080.
refresh_in_secondsThe portfolio and dashboard views are displayed with a refresh. Here the latter will be every 120 seconds
coingecko_chart_apiAPI for graphs. Do not modify.
geckoterminal_networks_urlURL to get networks from geckoterminal. Don't change anything.
notification_ntfy_urlURL for notifications. Don't change anything.
notification_ntfy_topicKey/topic that you declared in the NTFY application (see Alertes section below).
chain_explorersURLs of major blockchain explorers. You can add more.
platforms_apiFor experimentation. Automatic retrieving of binance trades requires the binance block with correct values

You create (or copy from Github project) a file docker-compose-images.yml in <CRYPTO_HOME> directory:

services:
  dashboard:
    image: labarrem/crypto-dashboard-ui:stable
    ports:
      - "8080:8080"
    depends_on:
      - mongo
    volumes:
      - <CRYPTO_HOME>/dashboard/icons:/home/node/app/public/images/icons
      - <CRYPTO_HOME>/dashboard/config:/home/node/app/config
    restart: unless-stopped
  updater:
    image: labarrem/crypto-dashboard-data:stable
    depends_on:
      - mongo
    volumes:
      - <CRYPTO_HOME>/dashboard/config:/home/node/app/config
    restart: unless-stopped
  mongo:
    image: mongo:4.4
    volumes:
      - <CRYPTO_HOME>/dashboard/mongodb:/data/db
    ports:
      - "27017:27017"
    restart: unless-stopped

by replacing all the strings '<CRYPTO_HOME>' with the chosen directory (value of CRYPTO_HOME) above.

Note: the dashboard service listen port depends on the information coded in this docker-compose-images.yml file but also in the default.json configuration file. The port indicated in docker-compose-images.yml is 8080:8080. This indicates that you will be able to connect on the server via port 8080 (first 8080 before ':') at http://localhost:8080⁠. The second 8080 (after the ':') must match the port specified in the default.json file. You can only change the port number before the ':' character.

To launch, submit the following command (in <CRYPTO_HOME> directory) and access the dashboard by http://localhost:8080⁠

  docker compose -f ./docker-compose-images.yml up -d

⁠Alerts

It is possible to define alerts on the evolution and survey views.

Notifications are sent to any device where the application open-source ntfy⁠ is installed (Android, IOS, desktop). The necessary settings were discussed above, in the default.json configuration file.

Tag summary

Content type

Image

Digest

sha256:329038baa…

Size

90.5 MB

Last updated

7 months ago

docker pull labarrem/crypto-dashboard-ui:1