> ## Documentation Index
> Fetch the complete documentation index at: https://seilabs-docs-evm-cookbook.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# The Graph

> Build and deploy subgraphs on The Graph to efficiently index and query data from Sei smart contracts, with step-by-step instructions from initialization to production deployment.

When you build a dApp, it can be difficult to get historical data for a smart
contract. [The Graph](https://thegraph.com/) gives you an easy way to query
smart contract data through APIs called subgraphs. The Graph's infrastructure
relies on a decentralized network of indexers. This lets your dApp be fully
decentralized.

## Quick start

A subgraph takes only a few minutes to set up. To get started, follow these
three steps:

1. Initialize your subgraph project
2. Deploy and publish
3. Query from your dApp

Pricing: All developers get 100K free queries per month on the decentralized
network. After these free queries, you pay only for usage, at \$4 for every 100K
queries.

## 1. Initialize your subgraph project

### Create a subgraph on Subgraph Studio⁠

Go to the [Subgraph Studio](https://thegraph.com/studio/) and connect your
wallet. Then click **Create a Subgraph**. When you enter the subgraph name, use
Title Case: "Subgraph Name Chain Name."

<img src="https://mintcdn.com/seilabs-docs-evm-cookbook/IhEyu7GQ2MVOnsHK/assets/ecosystem/resources/the-graph/create_subgraph.png?fit=max&auto=format&n=IhEyu7GQ2MVOnsHK&q=85&s=4c4555d08b2c956604747f1e3a80b55a" alt="Create a Subgraph" width="854" height="765" data-path="assets/ecosystem/resources/the-graph/create_subgraph.png" />

*Create a Subgraph*

Your subgraph's page then opens. The right side of the page shows all the CLI
commands that you need:

<img src="https://mintcdn.com/seilabs-docs-evm-cookbook/IhEyu7GQ2MVOnsHK/assets/ecosystem/resources/the-graph/cli_commands.png?fit=max&auto=format&n=IhEyu7GQ2MVOnsHK&q=85&s=55b482f63c0bcfa59fc53e5c93e7e127" alt="CLI commands" width="1231" height="1048" data-path="assets/ecosystem/resources/the-graph/cli_commands.png" />

*CLI Commands*

### Install the Graph CLI⁠

On your local machine, run this command:

```bash theme={null}
npm install -g @graphprotocol/graph-cli
```

### Initialize your subgraph⁠

You can copy this command from your subgraph page. The copied command includes
your subgraph slug:

```bash theme={null}
graph init --studio <SUBGRAPH_SLUG>
```

The CLI then prompts you for some information about your subgraph:

<img src="https://mintcdn.com/seilabs-docs-evm-cookbook/IhEyu7GQ2MVOnsHK/assets/ecosystem/resources/the-graph/cli_sample.png?fit=max&auto=format&n=IhEyu7GQ2MVOnsHK&q=85&s=510de1b54828f817d87d1053398a6770" alt="CLI sample" width="1003" height="438" data-path="assets/ecosystem/resources/the-graph/cli_sample.png" />

*CLI*

Make sure that your contract is verified on the block explorer. The CLI then
gets the ABI automatically and sets up your subgraph. The default settings generate an entity
for each event.

## 2. Deploy & publish

### Deploy to Subgraph Studio⁠

First, run these commands:

```bash theme={null}
$ graph codegen
$ graph build
```

Then run these commands to authenticate and deploy your subgraph. You can copy
them from your subgraph's page in Studio. The copied commands include your
deploy key and subgraph slug:

```bash theme={null}
$ graph auth --studio <DEPLOY_KEY>
$ graph deploy --studio <SUBGRAPH_SLUG>
```

The CLI asks for a version label. You can enter something like v0.0.1, but you
can choose any format.

### Test your subgraph⁠

You can test your subgraph with a sample query in the playground section. The
**Details** tab shows an API endpoint. You can use that endpoint to test from
your dApp.

<img src="https://mintcdn.com/seilabs-docs-evm-cookbook/IhEyu7GQ2MVOnsHK/assets/ecosystem/resources/the-graph/playground.png?fit=max&auto=format&n=IhEyu7GQ2MVOnsHK&q=85&s=3cde9b623f6e9d43445701bcdbc7b862" alt="Playground" width="1370" height="768" data-path="assets/ecosystem/resources/the-graph/playground.png" />

*Run your GraphQL query in Studio*

### Publish your subgraph to The Graph's decentralized network

When your subgraph is ready for production, you can publish it to the
decentralized network. On your subgraph's page in Subgraph Studio, click
**Publish**:

<img src="https://mintcdn.com/seilabs-docs-evm-cookbook/IhEyu7GQ2MVOnsHK/assets/ecosystem/resources/the-graph/publish_button.png?fit=max&auto=format&n=IhEyu7GQ2MVOnsHK&q=85&s=6b4de82c04a9512d7f805850703c63ec" alt="Publish button" width="2000" height="704" data-path="assets/ecosystem/resources/the-graph/publish_button.png" />

*Click Publish*

Before you can query your subgraph, Indexers need to start serving queries on
it. To speed up this process, you can curate your own subgraph with GRT.

When you publish, you see the option to curate your subgraph. Signaling GRT on
your own subgraph helps make sure that it is indexed and available for queries
as soon as possible. For current guidance on how much GRT to signal, see The
Graph's [curating documentation](https://thegraph.com/docs/en/resources/roles/curating/).

<img src="https://mintcdn.com/seilabs-docs-evm-cookbook/IhEyu7GQ2MVOnsHK/assets/ecosystem/resources/the-graph/publish_screen.png?fit=max&auto=format&n=IhEyu7GQ2MVOnsHK&q=85&s=9344c9a5de3e6c7e02dc36b4c838b5b8" alt="Publish screen" width="1600" height="1065" data-path="assets/ecosystem/resources/the-graph/publish_screen.png" />

*Publish screen*

<Warning>The Graph's smart contracts are all on Arbitrum One, even if your subgraph indexes data from Ethereum, BSC, or any other [supported chain](https://thegraph.com/docs/en/developing/supported-networks/).</Warning>

## 3. Query your subgraph

To query any subgraph on the decentralized network, pass a GraphQL query to the
subgraph's query URL. You can find the query URL at the top of the subgraph's
Explorer page.

This example is from the
[CryptoPunks Ethereum subgraph](https://thegraph.com/explorer/subgraphs/HdVdERFUe8h61vm2fDyycHgxjsde5PbB832NHgJfZNqK)
by Messari:

<img src="https://mintcdn.com/seilabs-docs-evm-cookbook/IhEyu7GQ2MVOnsHK/assets/ecosystem/resources/the-graph/query_url.png?fit=max&auto=format&n=IhEyu7GQ2MVOnsHK&q=85&s=7dfd761fb795c2273b49a629223bfcb8" alt="Query URL" width="1600" height="530" data-path="assets/ecosystem/resources/the-graph/query_url.png" />

*Query URL*

The query URL for this subgraph is:
`https://gateway-arbitrum.network.thegraph.com/api/`**\[api-key]**`/subgraphs/id/HdVdERFUe8h61vm2fDyycHgxjsde5PbB832NHgJfZNqK`

To send GraphQL queries to this endpoint, fill in your own API key.

### Getting your own API key

<img src="https://mintcdn.com/seilabs-docs-evm-cookbook/IhEyu7GQ2MVOnsHK/assets/ecosystem/resources/the-graph/api_keys.png?fit=max&auto=format&n=IhEyu7GQ2MVOnsHK&q=85&s=9edb64933dc5a225b609856ba14e760e" alt="API keys" width="1600" height="503" data-path="assets/ecosystem/resources/the-graph/api_keys.png" />

*API keys*

In Subgraph Studio, the **API Keys** menu is at the top of the page. You can
create API keys there.

## Appendix

### Sample query

This query shows the most expensive CryptoPunks sold.

```graphql theme={null}
{
  trades(orderBy: priceETH, orderDirection: desc) {
    priceETH
    tokenId
  }
}
```

If you pass this query to the query URL, it returns this result:

```json theme={null}
{
  "data": {
    "trades": [
      {
        "priceETH": "124457.067524886018255505",
        "tokenId": "9998"
      },
      {
        "priceETH": "8000",
        "tokenId": "5822"
      },
//      ...
```

<Tip>
  Trivia: The top sales list on the [CryptoPunks website](https://cryptopunks.app/cryptopunks/topsales) shows Punk #5822 as the top sale, not #9998. The reason is that the website censors the flash-loan sale.
</Tip>

### Sample code

```jsx theme={null}
const axios = require('axios');

const graphqlQuery = `{
  trades(orderBy: priceETH, orderDirection: desc) {
    priceETH
    tokenId
  }
}`;
const queryUrl = 'https://gateway-arbitrum.network.thegraph.com/api/[api-key]/subgraphs/id/HdVdERFUe8h61vm2fDyycHgxjsde5PbB832NHgJfZNqK';

const graphQLRequest = {
  method: 'post',
  url: queryUrl,
  data: {
    query: graphqlQuery
  }
};

// Send the GraphQL query
axios(graphQLRequest)
  .then((response) => {
    // Handle the response here
    const data = response.data.data;
    console.log(data);
  })
  .catch((error) => {
    // Handle any errors
    console.error(error);
  });
```

### Additional resources:

* To learn the ways that you can optimize and customize your subgraph for better
  performance, read about
  [creating a subgraph](https://thegraph.com/docs/en/developing/creating-a-subgraph/).
* For more information about how to query data from your subgraph, see the
  [querying documentation](https://thegraph.com/docs/en/querying/querying-the-graph/).


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.