Skip to content

Latest commit

 

History

History
130 lines (88 loc) · 3.04 KB

README.md

File metadata and controls

130 lines (88 loc) · 3.04 KB
Raw

Autonomys Network Space Race Plot-O-Meter

Welcome to the Autonomys Network Space Race Plot-O-Meter project! This application displays real-time blockchain data in a visually engaging thermometer, ranging from 0 PiB to 20 PiB, using Auto SDK, JavaScript and pure CSS.

Prerequisites

  • Node.js: Version 14 or higher is recommended.
  • npm: Node Package Manager, comes with Node.js.

Features

  • Real-Time Data: Fetches and displays the latest spacePledged data from the Autonomys blockchain every second.
  • Dynamic Visualization: A thermometer that visually represents the data, with animations and effects.
  • Cosmic Theme: A space-inspired design using pure CSS, including a moving starfield and nebula effect.
  • Pure CSS Design: No images required; all visuals are created using CSS.

Getting Started

Forking the Repository

  1. Fork the Repository on GitHub:

    • Navigate to the original repository on GitHub.
    • Click on the Fork button at the top-right corner of the page.
    • This will create a copy of the repository under your GitHub account.

Cloning the Repository

  1. Clone Your Forked Repository:

    Open your terminal or command prompt and run the following command, replacing <your-username> with your GitHub username:

    git clone https://github.com/<your-username>/autonomys-space-race-plotometer.git

  2. Navigate to the Project Directory:

    cd autonomys-space-race-plotometer

Installing Dependencies

  1. Initialize npm:

    If a package.json file isn't already present, initialize npm:

    npm init -y

  2. Install Required Packages:

    npm install express @autonomys/auto-consensus @autonomys/auto-utils

  3. Update package.json:

    Ensure your package.json includes the following:

    {
  "name": "autonomys-space-race-plotometer",
  "version": "1.0.0",
  "description": "Autonomys Network Space Race Plot-O-Meter",
  "main": "server.js",
  "type": "module",
  "scripts": {
    "start": "node server.js"
  },
  "dependencies": {
    "express": "^4.17.1",
    "@autonomys/auto-consensus": "^1.0.0",
    "@autonomys/auto-utils": "^1.0.0"
  }
}

    Adjust versions as necessary.

Starting the Server

  1. Run the Express Server:

    npm start

    You should see:

    Server running at http://localhost:3000

Usage

  1. Access the Application:

    Open your web browser and navigate to:

    http://localhost:3000/

    You should see the Autonomys Network Space Race Plot-O-Meter displaying real-time data with dynamic visuals.

Project Structure

Your project directory should look like this:

autonomys-space-race-plotometer/
├── server.js
├── package.json
└── public/
    └── index.html
  • server.js: The Express server file.
  • package.json: Contains project metadata and dependencies.
  • public/index.html: The main HTML file for the front-end.

--