Skip to content

BCS-Labs/tpscore-web-client

Repository files navigation

TPScore

GitHub nycrc config on GitHub

Description

TPScore simplifies TPS Data Analysis for non-technical users in the Polkadot Ecosystem.

TPScore aims to provide non-technical users in the Polkadot ecosystem with an accessible and user-friendly platform for analyzing TPS (Transactions per Second) data. Our goal is to bridge the gap between technical intricacies and user-friendly visualization, empowering individuals to make informed decisions about blockchain adoption, investment, and development.

The project consists of two main parts:

  1. ETL System
  2. User Interface (UI) with Data Visualizations

This repository contains the User Interface (UI) with Data Visualizations, that includes visually appealing and informative visualizations of the data, reducing users barier to understanding Polkadot parachains metrics. This repository is a part of Milestone 2 submission for the Grants-Program.

How to run the project using Docker

Run the ETL System first:

  1. Clone ETL System repository with git clone & move into it with cd tpscore-etl-system

Create and Run MySQL Database Container

  1. Navigate to the 'db' directory from the project's root directory: cd db
  2. Build the Docker image using the Dockerfile: docker build -t mysql_tpscore .
  3. Run a container with the MySQL database exposing 3306 port: docker run --name db_mysql -p 3306:3306 -d mysql_tpscore

Create and Run Airflow Container

  1. Navigate to the 'airflow' directory from the project's root directory: cd ../airflow
  2. Launch the airflow-init container: docker compose up airflow-init
  3. Build an image using the Dockerfile and docker-compose files: docker build .
  4. Start Airflow services: docker compose up -d

Then run the TPScore UI project:

  1. Clone this repository with git clone & move into it with cd tpscore-web-client

Create and Run Next.js Container

  1. Build the Docker image using the Dockerfile: docker build -t tpscore-web-client .
  2. Run a container with the Next.js exposing 3000 port: docker run --name tpscore-web-client -p 3000:3000 -d tpscore-web-client

Then create a network and add containers to it.

  1. Create a Docker network: docker network create net_tpscore
  2. Connect the 'db_mysql' container: docker network connect net_tpscore db_mysql
  3. Connect the 'airflow_scheduler' container: docker network connect net_tpscore airflow_scheduler
  4. Connect the 'tpscore-web-client' container: docker network connect net_tpscore tpscore-web-client

Usage

Access the Airflow GUI to run DAG:

  1. Go to http://localhost:8080/
  2. Log in using the credentials (airflow, airflow) Airflow Login
  3. Find the get_data_tpscore DAG and activate it by moving toggle to the right Run DAG
  4. Click on the DAG to verify successful execution (squares will be dark green, indicating error-free execution). DAG Run Success

Access the TPScore UI

  1. Go to http://localhost:3000/ and verify all parachains are there.

TPScore UI

How to run project for development

  1. Prerequisites
  1. Install dependencies
yarn install
  1. Add database credentials inside .env.local.
DB_HOST=db_host
DB_USER=db_admin
DB_PASSWORD=db_admin_password
DB_NAME=db_name
  1. Run project
yarn dev

Lint the project

yarn lint

Run unit tests

Unit tests for core functions of the application are in src/test.

yarn test

Tests output

Check test coverage

yarn coverage

Build the project for production

yarn build

Run the project in production mode

yarn start

Credits

This open-source project was developed for the Polkadot community and relies on various open-source libraries:

License

This project is licensed under GPLv3. For more details, refer to the license document.