Subgraph Development and Querying Workshop

Video presentation of this workshop

Workshop Slides

Open These Tabs to Code Along with Live Workshop:

Subgraph Studio
Cryptopunks contract address (Etherscan) 0xb47e3cd837ddf8e4c57f05d70ab865de6e193bbb
Jerry Okolo's Published CryptoPunks Subgraph
- This subgraph's repo
- This subgraph's schema.graphql
Build a dapp with ScaffoldETH-2 and Subgraphs

Prerequisites

Install graph-cli: yarn global add @graphprotocol/graph-cli

Learning Environment 1 :

Compare a Starter Subgraph with a Published Cryptopunks Subgraph Thats Live on The Graph Network

Deploy a Starter Subgraph

1. Gather information

Miniscan.xyz was deprecated.

Instead, use Cana to find important information relevant to your subgraph (smart contract name, ABI, startblock).

Cryptopunks contract on Etherscan: 0xb47e3cd837ddf8e4c57f05d70ab865de6e193bbb

2. Go to Subgraph Studio, and create a new subgraph

Follow the instructions in Subgraph Studio to spin up a new subgraph on your local computer using graph-cli.
Choose "yes" when asked if wanting to index events as entites.
graph deploy... to deploy your subgraph

Review Key Files in your Starter Cryptopunks Subgraph.

subgraph.yaml (Subgraph Manifest)
src/mappings.ts (Subgraph Logic)
schema.graphql (Presented Subgraph Data)

Compare Starter Subgraph's Key Files to Published Cryptopunks Subgraph Key Files

Jerry Okolo's Published Cryptopunks Subgraph published on The Graph Network.
https://github.com/itsjerryokolo/CryptoPunks
See what strategies Jerry uses in his subgraph and if you'd like to incorporate his strategies into your subgraph.
An an exercise, try answering these questions with Jerry's Cryptopunks subgraph and your Cryptopunks subgraph with well-designed queries in the subgraph Playground.

- What are the first 10 transfers in Cryptopunks history
- Find the total value in Eth sales all punks, the total supply, and the total number of sales?
- 10 highest value Cryptopunks transactions of all time?
- How much ETH sales in total?
- Does Vitalik have a Cryptopunk?
- How many Cryptopunks wear a Pilot Helmet?
- What account has made the most transactions ever?
- Provenance (Who owned it before? Is it really the right one?)
- If available (only on-chain market places), what is the current asking price?
- What’s the highest current bid?
- Number of transfers made in the first block of Cryptopunks deployment?

Next steps:

Try out Learning Environment 2!

Learning Environment 2:

Deploy a Starter Subgraph and Extend an Entity

1. Gather information

Use Miniscan to find important information relevant to your subgraph (smart contract name, ABI, startblock).

Cryptopunks contract on Etherscan

2. Go to Subgraph Studio, and create a new subgraph

Follow the instructions in Subgraph Studio to spin up a new subgraph on your local computer using graph-cli.
Enter information gathered from MiniScan into graph-cli as prompted.
Choose "yes" when asked if wanting to index events as entites.
graph deploy... to deploy your subgraph

Review key files in your starter Cryptopunks subgraph.

subgraph.yaml (Subgraph Manifest)
src/mappings.ts (Subgraph Logic)
schema.graphql (Presented Subgraph Data)

Understand the Generated Transfer Entity in Schema.graphql

# schema.graphql
type Transfer @entity(immutable: true) {
	id: Bytes!
	from: Bytes! # address
	to: Bytes! # address
	value: BigInt! # uint256
	blockNumber: BigInt!
	blockTimestamp: BigInt!
	transactionHash: Bytes!
}

Extend the `Transfer` Entity

Lets create a property in the Transfer entity that records the gas price of the transfer.

Add gasPrice to Transfer entity:

# schema.graphql
type Transfer @entity(immutable: true) {
	id: Bytes!
	from: Bytes! # address
	to: Bytes! # address
	value: BigInt! # uint256
	blockNumber: BigInt!
	blockTimestamp: BigInt!
	transactionHash: Bytes!
	gasPrice: BigInt! ## ADDED HERE
}

Update mappings.ts to send event data to the `gasPrice` property on the Transfer entity

// mappings.ts
export function handleTransfer(event: TransferEvent): void {
	let entity = new Transfer(
		event.transaction.hash.concatI32(event.logIndex.toI32())
	);
	entity.from = event.params.from;
	entity.to = event.params.to;
	entity.value = event.params.value;

	entity.blockNumber = event.block.number;
	entity.blockTimestamp = event.block.timestamp;
	entity.transactionHash = event.transaction.hash;

	entity.gasPrice = event.transaction.gasPrice;

	entity.save();
}

Add a new entity to store Account information

This new gasSpent property will total gas spent by an Account.

# schema.graphql
type Transfer @entity(immutable: true) {
	id: Bytes!
	from: Bytes! # address
	to: Bytes! # address
	value: BigInt! # uint256
	blockNumber: BigInt!
	blockTimestamp: BigInt!
	transactionHash: Bytes!
	gasPrice: BigInt!
}
type Account @entity {
	id: Bytes! # address
	gasSpent: BigInt! # uint256
}

Update mappings.ts to populate new `Account` entity

You must import BigInt from the graph-ts typscript helper library to perform the plus() function described below.

// src/mappings.ts
import { BigInt } from "@graphprotocol/graph-ts";

Read more about the graph-ts helper library.

// mappings.ts
export function handleTransfer(event: TransferEvent): void {
	let entity = new Transfer(
		event.transaction.hash.concatI32(event.logIndex.toI32())
	);
	entity.from = event.params.from;
	entity.to = event.params.to;
	entity.value = event.params.value;

	entity.blockNumber = event.block.number;
	entity.blockTimestamp = event.block.timestamp;
	entity.transactionHash = event.transaction.hash;
	entity.gasPrice = event.transaction.gasPrice;

	entity.save();

	// Load account from store. If account does not exist, create an account and set the gasSpent to 0.

	let account = Account.load(
		event.transaction.hash.concatI32(event.block.hash.toI32())
	);
	if (account == null) {
		account = new Account(
			event.transaction.hash.concatI32(event.block.hash.toI32())
		);
		account.gasSpent = BigInt.fromI32(0);
	}

	// Add the gas price of the current transaction to the total gas spent
	account.gasSpent = account.gasSpent.plus(event.transaction.gasPrice);

	account.save();
}

Next Steps:

Add more entities and mappings logic as desired.
Build queries using the Playground Explorer and reference the The Graph GraphQL docs to improve query accuracy.
Try building with Kevin Jones' blog that combines ScaffoldETH-2 and Subgraphs

Happy hacking,

Marcus Rein

Developer Relations and Developer Success

Edge & Node

https://www.twitter.com/Marcus_Rein_

Other resources

marcusrein/Subgraph-Dev-Workshop

ErrorLooks like something went wrong!

About

Resources

Uh oh!

Stars

Watchers

Forks

Releases

Packages 0

Uh oh!

Languages

Error
Looks like something went wrong!

Packages