Menu

1 / 4

[Tutorial] Reading and Reacting to Contract State from a Frontend on Midnight network

DEV Community·Syv·6 months ago
#BCgEQkBc
Reading 0:00
15s threshold

📁 Full Source Code: midnight-apps/unshielded-token

Target audience: Developers

Prerequisites

Node.js installed (v20+)

A Midnight Wallet (e.g., 1AM or Lace)

Some Preprod faucet NIGHT tokens

An existing Midnight DApp with a deployed smart contract

The smart contract compiled so its JS bindings exist (e.g., /contracts/managed/<name>/contract/index.js )

INDEXER_HTTP and INDEXER_WS constants pointing to the Preprod indexer

A package.json with the needed packages:

@midnight-ntwrk/midnight-js-indexer-public-data-provider

@midnight-ntwrk/midnight-js-contracts

@midnight-ntwrk/midnight-js-types

@midnight-ntwrk/compact-runtime

@midnight-ntwrk/dapp-connector-api

@midnight-ntwrk/ledger-v8

@midnight-ntwrk/midnight-js-fetch-zk-config-provider

@midnight-ntwrk/midnight-js-http-client-proof-provider

@midnight-ntwrk/midnight-js-level-private-state-provider

@midnight-ntwrk/midnight-js-network-id

react , react-dom , react-router-dom

zustand

Summary

This guide shows how to query and visualize deployed…

Continue reading — create a free account

Join HashtagPLUS to read full articles, follow hashtags, vote, and join the conversation.