Git Product home page Git Product logo

block-explorer's Introduction

zkSync Era Block Explorer

Online blockchain browser for viewing and analyzing zkSync Era blockchain.

๐Ÿ“Œ Overview

This repository is a monorepo consisting of 3 packages:

  • Worker - an indexer service for zkSync Era blockchain data. The purpose of the service is to read the data from the blockchain in real time, transform it and fill in it's database with the data in a way that makes it easy to be queried by the API service.
  • API - a service providing Web API for retrieving structured zkSync Era blockchain data collected by Worker. It connects to the Worker's database to be able to query the collected data.
  • App - a front-end app providing an easy-to-use interface for users to view and inspect transactions, blocks, contracts and more. It makes requests to the API to get the data and presents it in a way that's easy to read and understand.

๐Ÿ› Architecture

The following diagram illustrates how are the block explorer components connected:

flowchart
  subgraph blockchain[Blockchain]
    Blockchain[zkSync Era JSON-RPC API]
  end

  subgraph explorer[Block explorer]
    Database[("Block explorer DB<br/>(PostgreSQL)")]
    Worker(Worker service)
    API(API service)
    App(App)

    Worker-.Save processed data.->Database
    API-.Query data.->Database
    App-."Request data (HTTP)".->API
    App-."Request data (HTTP)".->Blockchain
  end

  Worker-."Request data (HTTP)".->Blockchain

Worker service is responsible for getting data from blockchain using zkSync Era JSON-RPC API, processing it and saving into the database. API service is connected to the same database where it gets the data from to handle API requests. It performs only read requests to the database. The front-end App makes HTTP calls to the Block Explorer API to get blockchain data and to the zkSync Era JSON-RPC API for reading contracts, performing transactions etc.

๐Ÿš€ Features

  • โœ… View transactions, blocks, transfers and logs.
  • โœ… Inspect accounts, contracts, tokens and balances.
  • โœ… Verify smart contracts.
  • โœ… Interact with smart contracts.
  • โœ… Standalone HTTP API.
  • โœ… Local node support.

๐Ÿ“‹ Prerequisites

  • Ensure you have node >= 18.0.0 and npm >= 9.0.0 installed.

๐Ÿ›  Installation

$ npm install

โš™๏ธ Setting up env variables

Manually set up env variables

Make sure you have set up all the necessary env variables. Follow Setting up env variables for Worker and Setting up env variables for API for instructions. For the App package you might want to edit environment config, see Environment configs.

Build env variables based on your zksync-era local repo setup

Make sure you have zksync-era repo set up locally. You must have your environment variables files present in the zksync-era repo at /etc/env/*.env for the build envs script to work.

The following script sets .env files for Worker and API packages as well as environment configuration file for App package based on your local zksync-era repo setup.

$ npm run hyperchain:configure

You can review and edit generated files if you need to change any settings.

๐Ÿ‘จโ€๐Ÿ’ป Running locally

Before running the solution, make sure you have a database server up and running, you have created a database and set up all the required environment variables. To create a database run the following command:

$ npm run db:create

To run all the packages (Worker, API and front-end App) in development mode run the following command from the root directory.

$ npm run dev

For production mode run:

$ npm run build
$ npm run start

Each component can also be started individually. Follow individual packages README for details.

๐Ÿณ Running in Docker

There is a docker compose configuration that allows you to run Block Explorer and all its dependencies in docker. Just run the following command to spin up the whole environment:

docker-compose up

It will run local Ethereum node, ZkSync Era, Postgres DB and all Block Explorer services.

โ›“๏ธ Connection to your Hyperchain

To get block-explorer connected to your ZK Stack Hyperchain you need to set up all the the necessary environment and configuration files with your Hyperchain settings. You can use a script to build them. See Setting up env variables.

๐Ÿ” Verify Block Explorer is up and running

To verify front-end App is running open http://localhost:3010 in your browser. API should be available at http://localhost:3020. Worker - http://localhost:3001.

๐Ÿ•ต๏ธโ€โ™‚๏ธ Testing

Run unit tests for all packages:

$ npm run test

Run e2e tests for all packages:

$ npm run test:e2e

Run tests for a specific package:

$ npm run test -w {package}

For more details on testing please check individual packages README.

๐Ÿ’ป Conventional Commits

We follow the Conventional Commits specification.

๐Ÿ“˜ License

zkSync Era Block Explorer is distributed under the terms of either

at your option.

๐Ÿ”— Production links

block-explorer's People

Contributors

romsters avatar vasyl-ivanchuk avatar dutterbutter avatar mexicanace avatar yorik avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.