From 7a5772437639119e498ef5b44a43a1d4c970a52c Mon Sep 17 00:00:00 2001 From: saimeunt Date: Tue, 19 Nov 2024 19:23:32 +0100 Subject: [PATCH 1/4] Add OP Scan block explorer to Optimism Docs --- .../builders/chain-operators/tools/_meta.json | 1 + .../chain-operators/tools/op-scan.mdx | 165 ++++++++++++++++++ 2 files changed, 166 insertions(+) create mode 100644 pages/builders/chain-operators/tools/op-scan.mdx diff --git a/pages/builders/chain-operators/tools/_meta.json b/pages/builders/chain-operators/tools/_meta.json index 990ea87a2..58620c7e9 100644 --- a/pages/builders/chain-operators/tools/_meta.json +++ b/pages/builders/chain-operators/tools/_meta.json @@ -5,5 +5,6 @@ "op-conductor": "op-conductor", "op-deployer": "op-deployer", "op-txproxy": "op-txproxy", + "op-scan": "OP Scan Block Explorer", "proxyd": "proxyd" } diff --git a/pages/builders/chain-operators/tools/op-scan.mdx b/pages/builders/chain-operators/tools/op-scan.mdx new file mode 100644 index 000000000..2c658bec1 --- /dev/null +++ b/pages/builders/chain-operators/tools/op-scan.mdx @@ -0,0 +1,165 @@ +--- +title: op-scan +lang: en-US +description: Learn how to launch OP Scan, a block explorer designed for your OP Stack chain. +--- + +import { Callout } from "nextra/components"; + +# 🔎 OP Scan + +OP Scan is a transaction explorer tailored specifically for the [OP Stack](https://docs.optimism.io/builders/chain-operators/tutorials/create-l2-rollup) and the [Superchain vision](https://www.youtube.com/watch?v=O6vYNgrQ1LE). It's focused on being lightweight so that anyone can run it locally next to an OP Stack devnet or any other compatible OP Stack based rollup. + + + Check out the [OP Scan README](https://github.com/walnuthq/op-scan) for + up-to-date information on how to launch OP Scan. + + +![screenshot](https://raw.githubusercontent.com/walnuthq/op-scan/main/screenshot.png) + +# ⚙️ Installation + +### Getting Started Video + +[Here's a video walkthrough](https://www.loom.com/share/3b79f0b25e44443eb16d296aba021764) on how to launch the explorer locally configured for OP Sepolia testnet. + +### Required Dependencies + +The app requires the following dependencies: + +``` +NodeJS >= 22 +pnpm >= 9 +``` + +### Explorer Configuration + +Clone this repository: + +```sh +git clone git@github.com:walnuthq/op-scan +``` + +Install the dependencies: + +```sh +pnpm install +``` + +You will need to copy `.env.local.example` into `.env.local` at the root of your repository and populate it with your own values. + +In particular you will need to provide configuration for both L1 and L2 chains: + +``` +NEXT_PUBLIC_L1_CHAIN_ID="11155111" +NEXT_PUBLIC_L1_NAME="Sepolia" +NEXT_PUBLIC_L1_RPC_URL="https://ethereum-sepolia-rpc.publicnode.com" +NEXT_PUBLIC_L2_CHAIN_ID="11155420" +NEXT_PUBLIC_L2_NAME="OP Sepolia" +NEXT_PUBLIC_L2_RPC_URL="https://optimism-sepolia-rpc.publicnode.com" +``` + +You can get free node rpcs url by signing up to services such as [Alchemy](https://www.alchemy.com/), [Infura](https://www.infura.io/) or [QuickNode](https://www.quicknode.com/). + +You will also need to provide your L1 contracts addresses when using a devnet: + +``` +NEXT_PUBLIC_OPTIMISM_PORTAL_ADDRESS="..." +NEXT_PUBLIC_L1_CROSS_DOMAIN_MESSENGER_ADDRESS="..." +``` + +You will find theses addresses in your rollup deployment artifacts in `contracts-bedrock/deployments/your-deployment/L1Contract.json`. +Note that you always need to provide the proxy address, not the underlying contract. + +If you don't want to run the explorer with your local chain setup, you will find all the necessary environment variables in `.env.local.example` to configure the explorer with OP Sepolia or OP Mainnet. + +If you want to be able to use the Write Contract feature on verified contracts, you will also need to provide a [Reown](https://docs.reown.com/) project ID. + +``` +NEXT_PUBLIC_REOWN_PROJECT_ID="REOWN_PROJECT_ID" +``` + +### Indexer Configuration + +To run the indexer, you first need to setup your `DATABASE_URL` in `.env.local` (we use SQLite by default but you can switch to PostgreSQL by changing the Prisma provider in `prisma/schema.prisma`) as well as websocket connections to your L1/L2 chains: + +``` +DATABASE_URL="file:dev.db" +L1_RPC_WS="wss://ethereum-sepolia-rpc.publicnode.com" +L2_RPC_WS="wss://optimism-sepolia-rpc.publicnode.com" +``` + +Then you can sync your local database with the Prisma schema: + +```sh +pnpm prisma:db:push +``` + +Now you will be able to start indexing the blockchain by running the `op-indexer` command: + +```sh +pnpm op-indexer +``` + +You should start seeing blocks getting indexed in your terminal and you can explore the state of your local database using Prisma studio: + +```sh +pnpm prisma:studio +``` + +If you need to change the Prisma schema at some point, make sure to regenerate the Prisma client and push to your local database: + +```sh +pnpm prisma:generate +pnpm prisma:db:push +``` + +Indexing a blockchain is putting a heavy load on the RPC as you need to perform a large number of JSON-RPC requests to fully index a block (along with transactions and logs). +When indexing non-local chains you will probably encounter 429 errors related to rate-limiting, you may provide up to 5 fallback RPC URLs in case this happens: + +``` +NEXT_PUBLIC_L1_FALLBACK1_RPC_URL="https://rpc.ankr.com/eth_sepolia" +NEXT_PUBLIC_L2_FALLBACK1_RPC_URL="https://rpc.ankr.com/optimism_sepolia" +NEXT_PUBLIC_L1_FALLBACK2_RPC_URL="https://endpoints.omniatech.io/v1/eth/sepolia/public" +NEXT_PUBLIC_L2_FALLBACK2_RPC_URL="https://endpoints.omniatech.io/v1/op/sepolia/public" +NEXT_PUBLIC_L1_FALLBACK3_RPC_URL="https://sepolia.drpc.org" +NEXT_PUBLIC_L2_FALLBACK3_RPC_URL="https://optimism-sepolia.drpc.org" +NEXT_PUBLIC_L1_FALLBACK4_RPC_URL="https://eth-sepolia.g.alchemy.com/v2/FALLBACK4_API_KEY" +NEXT_PUBLIC_L2_FALLBACK4_RPC_URL="https://opt-sepolia.g.alchemy.com/v2/FALLBACK4_API_KEY" +NEXT_PUBLIC_L1_FALLBACK5_RPC_URL="https://sepolia.infura.io/v3/FALLBACK5_API_KEY" +NEXT_PUBLIC_L2_FALLBACK5_RPC_URL="https://optimism-sepolia.infura.io/v3/FALLBACK5_API_KEY" +``` + +You can pass several parameters to the indexer to control the indexing range and execution: + +- `--l2-from-block` (short `-f`, defaults to latest block) start indexing from this L2 block. +- `--l2-index-block` (short `-b`) index this particular L2 block number. +- `--l1-from-block` (defaults to latest block) start indexing from this L1 block. +- `--l1-index-block` index this particular L1 block number. +- `--index-delay` (short `-d`, defaults to 1000) delay in ms between indexing 2 blocks to avoid overloading the RPC. + +Example of running the indexer: + +```sh +pnpm op-indexer -f 123416717 --l1-index-block 20426733 --l1-index-block 20426726 -d 500 +``` + +### Running the Explorer + +When you're done configuring your environment variables you can build the app: + +```sh +pnpm build +``` + +Make sure your local chain is started and the indexer is running, then launch the explorer to see it live at `http://localhost:3000` + +```sh +pnpm start +``` + +Alternatively you can launch the explorer in dev mode if you want to customize it: + +```sh +pnpm dev +``` From 913e368713b0919dd07e37386e3e91b321491069 Mon Sep 17 00:00:00 2001 From: saimeunt Date: Tue, 19 Nov 2024 20:59:12 +0100 Subject: [PATCH 2/4] Grammar and styling --- .../builders/chain-operators/tools/op-scan.mdx | 17 ++++++++--------- 1 file changed, 8 insertions(+), 9 deletions(-) diff --git a/pages/builders/chain-operators/tools/op-scan.mdx b/pages/builders/chain-operators/tools/op-scan.mdx index 2c658bec1..89953910e 100644 --- a/pages/builders/chain-operators/tools/op-scan.mdx +++ b/pages/builders/chain-operators/tools/op-scan.mdx @@ -1,7 +1,7 @@ --- -title: op-scan +title: OP Scan lang: en-US -description: Learn how to launch OP Scan, a block explorer designed for your OP Stack chain. +description: Learn how to launch OP Scan, a block explorer designed for your OP Stack chain --- import { Callout } from "nextra/components"; @@ -28,7 +28,7 @@ OP Scan is a transaction explorer tailored specifically for the [OP Stack](https The app requires the following dependencies: ``` -NodeJS >= 22 +Node.js >= 20 pnpm >= 9 ``` @@ -46,9 +46,8 @@ Install the dependencies: pnpm install ``` -You will need to copy `.env.local.example` into `.env.local` at the root of your repository and populate it with your own values. - -In particular you will need to provide configuration for both L1 and L2 chains: +Copy `.env.local.example` into `.env.local` at the root of your repository and populate it with your own values. +In particular, configure both L1 and L2 chains: ``` NEXT_PUBLIC_L1_CHAIN_ID="11155111" @@ -61,7 +60,7 @@ NEXT_PUBLIC_L2_RPC_URL="https://optimism-sepolia-rpc.publicnode.com" You can get free node rpcs url by signing up to services such as [Alchemy](https://www.alchemy.com/), [Infura](https://www.infura.io/) or [QuickNode](https://www.quicknode.com/). -You will also need to provide your L1 contracts addresses when using a devnet: +For devnet usage, specify the L1 contract addresses: ``` NEXT_PUBLIC_OPTIMISM_PORTAL_ADDRESS="..." @@ -81,7 +80,7 @@ NEXT_PUBLIC_REOWN_PROJECT_ID="REOWN_PROJECT_ID" ### Indexer Configuration -To run the indexer, you first need to setup your `DATABASE_URL` in `.env.local` (we use SQLite by default but you can switch to PostgreSQL by changing the Prisma provider in `prisma/schema.prisma`) as well as websocket connections to your L1/L2 chains: +To run the indexer, first set up your `DATABASE_URL` in `.env.local` (we use SQLite by default, but you can switch to PostgreSQL by changing the Prisma provider in `prisma/schema.prisma`) and configure websocket connections to your L1/L2 chains: ``` DATABASE_URL="file:dev.db" @@ -158,7 +157,7 @@ Make sure your local chain is started and the indexer is running, then launch th pnpm start ``` -Alternatively you can launch the explorer in dev mode if you want to customize it: +Alternatively, you can launch the explorer in dev mode if you want to customize it: ```sh pnpm dev From e8fe804174bec3b9a5a3f0fb4cbdd12424018646 Mon Sep 17 00:00:00 2001 From: saimeunt Date: Thu, 28 Nov 2024 22:02:55 +0100 Subject: [PATCH 3/4] Grammar and style --- pages/builders/chain-operators/tools/op-scan.mdx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/pages/builders/chain-operators/tools/op-scan.mdx b/pages/builders/chain-operators/tools/op-scan.mdx index 89953910e..7bfec05b1 100644 --- a/pages/builders/chain-operators/tools/op-scan.mdx +++ b/pages/builders/chain-operators/tools/op-scan.mdx @@ -100,7 +100,7 @@ Now you will be able to start indexing the blockchain by running the `op-indexer pnpm op-indexer ``` -You should start seeing blocks getting indexed in your terminal and you can explore the state of your local database using Prisma studio: +You should start seeing blocks getting indexed in your terminal, and you can explore the state of your local database using Prisma studio: ```sh pnpm prisma:studio @@ -113,7 +113,7 @@ pnpm prisma:generate pnpm prisma:db:push ``` -Indexing a blockchain is putting a heavy load on the RPC as you need to perform a large number of JSON-RPC requests to fully index a block (along with transactions and logs). +Indexing a blockchain puts a heavy load on the RPC as you need to perform many JSON-RPC requests to fully index a block (along with transactions and logs). When indexing non-local chains you will probably encounter 429 errors related to rate-limiting, you may provide up to 5 fallback RPC URLs in case this happens: ``` @@ -151,7 +151,7 @@ When you're done configuring your environment variables you can build the app: pnpm build ``` -Make sure your local chain is started and the indexer is running, then launch the explorer to see it live at `http://localhost:3000` +Make sure the indexer is running, then launch the explorer to see it live at `http://localhost:3000` ```sh pnpm start From 427875ff157bcb89f0aa0deee6b7ffe59a1946eb Mon Sep 17 00:00:00 2001 From: saimeunt Date: Fri, 29 Nov 2024 09:19:14 +0100 Subject: [PATCH 4/4] git clone url --- pages/builders/chain-operators/tools/op-scan.mdx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/pages/builders/chain-operators/tools/op-scan.mdx b/pages/builders/chain-operators/tools/op-scan.mdx index 7bfec05b1..120ca7fd9 100644 --- a/pages/builders/chain-operators/tools/op-scan.mdx +++ b/pages/builders/chain-operators/tools/op-scan.mdx @@ -37,7 +37,7 @@ pnpm >= 9 Clone this repository: ```sh -git clone git@github.com:walnuthq/op-scan +git clone https://github.com/walnuthq/op-scan.git ``` Install the dependencies: @@ -113,7 +113,7 @@ pnpm prisma:generate pnpm prisma:db:push ``` -Indexing a blockchain puts a heavy load on the RPC as you need to perform many JSON-RPC requests to fully index a block (along with transactions and logs). +Indexing a blockchain puts a heavy load on the RPC endpoint, as you need to perform many JSON-RPC requests to fully index a block (along with transactions and logs). When indexing non-local chains you will probably encounter 429 errors related to rate-limiting, you may provide up to 5 fallback RPC URLs in case this happens: ``` @@ -145,7 +145,7 @@ pnpm op-indexer -f 123416717 --l1-index-block 20426733 --l1-index-block 20426726 ### Running the Explorer -When you're done configuring your environment variables you can build the app: +When you're done configuring your environment variables, you can build the app: ```sh pnpm build