diff --git a/.github/workflows/playwright.yaml b/.github/workflows/playwright.yaml
index b0f110a..cda3d60 100644
--- a/.github/workflows/playwright.yaml
+++ b/.github/workflows/playwright.yaml
@@ -10,7 +10,8 @@ jobs:
     strategy:
       matrix:
         tutorial:
-          - "tests/how-to-test-contracts.spec.ts" 
+          - "tests/erc20-paymaster.spec.ts" 
+          - "tests/how-to-test-contracts.spec.ts"
 
     steps:
     - uses: actions/checkout@v4
@@ -21,4 +22,9 @@ jobs:
     - name: Install Playwright Browsers
       run: bun playwright install chromium --with-deps
     - name: Run test for ${{ matrix.tutorial }}
-      run: bun test:github ${{ matrix.tutorial }}
+      run: |
+        export TERM=xterm-256color
+        export COLUMNS=80
+        export LINES=24
+        script -q -c "bun test:github ${{ matrix.tutorial }}"
+      
diff --git a/.husky/commit-msg b/.husky/commit-msg
index 9e35954..9701dfe 100755
--- a/.husky/commit-msg
+++ b/.husky/commit-msg
@@ -1,3 +1,2 @@
-#!/bin/sh
-. "$(dirname "$0")/_/husky.sh"
+
 bunx --no-install commitlint --edit "$1"
diff --git a/.husky/pre-commit b/.husky/pre-commit
index 93f8566..84aec53 100755
--- a/.husky/pre-commit
+++ b/.husky/pre-commit
@@ -1,3 +1,2 @@
-#!/usr/bin/env sh
-. "$(dirname "$0")/_/husky.sh"
+
 bun lint-staged
diff --git a/.lintstagedrc.yml b/.lintstagedrc.yml
index 62c9d45..47a1035 100644
--- a/.lintstagedrc.yml
+++ b/.lintstagedrc.yml
@@ -2,7 +2,7 @@
   - prettier --list-different
   - eslint
 '*.md':
-  - cspell lint --file
   - markdownlint-cli2
+  - cspell lint --quiet --no-must-find-files --files
 '*.{json,yml}':
   - prettier --list-different
diff --git a/app.vue b/app.vue
index 90bf660..37dc731 100644
--- a/app.vue
+++ b/app.vue
@@ -15,17 +15,17 @@ useHead({
   },
 });
 
+const seoDescription =
+  'Build together with the ZKsync Community. Learn how to build amazing smart contracts and dApps on ZKsync Era.';
+
 useSeoMeta({
   titleTemplate: `%s - ${seo?.siteName}`,
   ogSiteName: seo?.siteName,
   ogUrl: 'https://code.zksync.io',
-  description:
-    'Build together with the ZKsync Community. Learn how to build amazing smart contracts and dApps on ZKsync Era.',
-  ogDescription:
-    'Build together with the ZKsync Community. Learn how to build amazing smart contracts and dApps on ZKsync Era.',
+  description: seoDescription,
+  ogDescription: seoDescription,
   twitterTitle: `%s`,
-  twitterDescription:
-    'Build together with the ZKsync Community. Learn how to build amazing smart contracts and dApps on ZKsync Era.',
+  twitterDescription: seoDescription,
   twitterCard: 'summary_large_image',
   twitterSite: '@zksync',
   twitterCreator: '@ZKsyncDevs',
diff --git a/components/IconOrbit.vue b/components/IconOrbit.vue
index b27d17b..0bc55de 100644
--- a/components/IconOrbit.vue
+++ b/components/IconOrbit.vue
@@ -138,16 +138,7 @@
 
 <script setup lang="ts"></script>
 
-<style scoped lang="scss">
-$orbitItemSize: 1.6em;
-$map: (
-  ring-0: 4,
-  ring-1: 3,
-  ring-2: 8,
-  ring-3: 3,
-);
-$lastRing: 3;
-
+<style scoped>
 * {
   box-sizing: border-box;
 }
@@ -165,9 +156,9 @@ html {
 }
 
 .orbit-icon {
-  width: $orbitItemSize;
-  height: $orbitItemSize;
-  line-height: $orbitItemSize;
+  width: 1.6em;
+  height: 1.6em;
+  line-height: 1.6em;
   font-size: 1.2em;
   border-radius: 50%;
   background: #ccc;
@@ -176,85 +167,215 @@ html {
   display: block;
 }
 
-$orbit-ring-left: 50%;
-$orbit-ring-top: 18%;
-
 .orbit-wrap {
   height: 40em;
   list-style: none;
   font-size: 1.3em;
-
-  > li {
-    position: absolute;
-    left: $orbit-ring-left;
-    top: $orbit-ring-top;
-    transform: translate(-50%, -50%);
-  }
+}
+.orbit-wrap > li {
+  position: absolute;
+  left: 50%;
+  top: 18%;
+  transform: translate(-50%, -50%);
 }
 
 ul[class^='ring'] {
-  @extend %ring;
   transition: all 300ms ease-in-out;
   box-shadow: none !important;
+}
+ul[class^='ring'] li:not(.black-hole) {
+  transition: all 300ms ease-in-out;
+}
 
-  li:not(.black-hole) {
-    @extend %orbiting-object;
-    transition: all 300ms ease-in-out;
-  }
+.light img {
+  background: rgb(215, 241, 251) !important;
 }
 
-@mixin orbit-item($numItems, $numRing) {
-  @for $s from 1 through $numItems + 1 {
-    // Spread items over the ring
-    $deg: calc(380deg / $numItems);
+.ring-0 {
+  width: 42em;
+  height: 42em;
+  animation: clockwiseRotate 75s linear infinite;
+}
+.ring-0 i,
+.ring-0 img {
+  animation: counterClockwiseRotate 75s linear infinite;
+  width: 60px;
+  height: 35px;
+  background: rgba(148, 148, 148, 0.826);
+}
+.ring-0 .black-hole {
+  transform: none !important;
+  position: absolute;
+  width: 41.8em;
+  height: 41.8em;
+  position: absolute;
+  top: 2px;
+  left: 2px;
+  border-radius: 50%;
+  box-sizing: content-box;
+}
 
-    .ring-#{$numRing} > *:nth-of-type(#{$s}) {
-      transform: rotate($s * $deg) translate(21em - ($numRing * 4)) rotate(-$s * $deg);
-    }
-  }
+.ring-0 > *:nth-of-type(1) {
+  transform: rotate(95deg) translate(21em) rotate(-95deg);
 }
 
-.light img {
-  background: rgb(215, 241, 251) !important;
+.ring-0 > *:nth-of-type(2) {
+  transform: rotate(190deg) translate(21em) rotate(-190deg);
 }
 
-// Render rings
-@for $i from 0 through $lastRing {
-  .ring-#{$i} {
-    $size: 42em - ($i * 8);
-    $randomized: random(15);
-    // decrease each ring in size
-    width: $size;
-    height: $size;
-    animation: clockwiseRotate (75s - ($i * $randomized)) linear infinite;
-
-    i,
-    img {
-      animation: counterClockwiseRotate (75s - ($i * $randomized)) linear infinite;
-      width: 60px;
-      height: 35px;
-      background: rgba(148, 148, 148, 0.826);
-    }
-
-    .black-hole {
-      transform: none !important;
-      position: absolute;
-      // background: black;
-      width: $size - 0.2em;
-      height: $size - 0.2em;
-      position: absolute;
-      top: 2px;
-      left: 2px;
-      border-radius: 50%;
-      box-sizing: content-box;
-    }
-  }
+.ring-0 > *:nth-of-type(3) {
+  transform: rotate(285deg) translate(21em) rotate(-285deg);
+}
+
+.ring-0 > *:nth-of-type(4) {
+  transform: rotate(380deg) translate(21em) rotate(-380deg);
+}
+
+.ring-0 > *:nth-of-type(5) {
+  transform: rotate(475deg) translate(21em) rotate(-475deg);
+}
+
+.ring-1 {
+  width: 34em;
+  height: 34em;
+  animation: clockwiseRotate 63s linear infinite;
+}
+.ring-1 i,
+.ring-1 img {
+  animation: counterClockwiseRotate 63s linear infinite;
+  width: 60px;
+  height: 35px;
+  background: rgba(148, 148, 148, 0.826);
+}
+.ring-1 .black-hole {
+  transform: none !important;
+  position: absolute;
+  width: 33.8em;
+  height: 33.8em;
+  position: absolute;
+  top: 2px;
+  left: 2px;
+  border-radius: 50%;
+  box-sizing: content-box;
+}
+
+.ring-1 > *:nth-of-type(1) {
+  transform: rotate(126.6666666667deg) translate(17em) rotate(-126.6666666667deg);
+}
+
+.ring-1 > *:nth-of-type(2) {
+  transform: rotate(253.3333333333deg) translate(17em) rotate(-253.3333333333deg);
+}
+
+.ring-1 > *:nth-of-type(3) {
+  transform: rotate(380deg) translate(17em) rotate(-380deg);
+}
+
+.ring-1 > *:nth-of-type(4) {
+  transform: rotate(506.6666666667deg) translate(17em) rotate(-506.6666666667deg);
+}
+
+.ring-2 {
+  width: 26em;
+  height: 26em;
+  animation: clockwiseRotate 63s linear infinite;
+}
+.ring-2 i,
+.ring-2 img {
+  animation: counterClockwiseRotate 63s linear infinite;
+  width: 60px;
+  height: 35px;
+  background: rgba(148, 148, 148, 0.826);
+}
+.ring-2 .black-hole {
+  transform: none !important;
+  position: absolute;
+  width: 25.8em;
+  height: 25.8em;
+  position: absolute;
+  top: 2px;
+  left: 2px;
+  border-radius: 50%;
+  box-sizing: content-box;
+}
+
+.ring-2 > *:nth-of-type(1) {
+  transform: rotate(47.5deg) translate(13em) rotate(-47.5deg);
+}
+
+.ring-2 > *:nth-of-type(2) {
+  transform: rotate(95deg) translate(13em) rotate(-95deg);
+}
+
+.ring-2 > *:nth-of-type(3) {
+  transform: rotate(142.5deg) translate(13em) rotate(-142.5deg);
+}
+
+.ring-2 > *:nth-of-type(4) {
+  transform: rotate(190deg) translate(13em) rotate(-190deg);
+}
+
+.ring-2 > *:nth-of-type(5) {
+  transform: rotate(237.5deg) translate(13em) rotate(-237.5deg);
+}
+
+.ring-2 > *:nth-of-type(6) {
+  transform: rotate(285deg) translate(13em) rotate(-285deg);
+}
+
+.ring-2 > *:nth-of-type(7) {
+  transform: rotate(332.5deg) translate(13em) rotate(-332.5deg);
+}
+
+.ring-2 > *:nth-of-type(8) {
+  transform: rotate(380deg) translate(13em) rotate(-380deg);
+}
+
+.ring-2 > *:nth-of-type(9) {
+  transform: rotate(427.5deg) translate(13em) rotate(-427.5deg);
+}
+
+.ring-3 {
+  width: 18em;
+  height: 18em;
+  animation: clockwiseRotate 60s linear infinite;
+}
+.ring-3 i,
+.ring-3 img {
+  animation: counterClockwiseRotate 60s linear infinite;
+  width: 60px;
+  height: 35px;
+  background: rgba(148, 148, 148, 0.826);
+}
+.ring-3 .black-hole {
+  transform: none !important;
+  position: absolute;
+  width: 17.8em;
+  height: 17.8em;
+  position: absolute;
+  top: 2px;
+  left: 2px;
+  border-radius: 50%;
+  box-sizing: content-box;
+}
+
+.ring-3 > *:nth-of-type(1) {
+  transform: rotate(126.6666666667deg) translate(9em) rotate(-126.6666666667deg);
+}
+
+.ring-3 > *:nth-of-type(2) {
+  transform: rotate(253.3333333333deg) translate(9em) rotate(-253.3333333333deg);
+}
 
-  @include orbit-item(map-get($map, ring-#{$i}), $i);
+.ring-3 > *:nth-of-type(3) {
+  transform: rotate(380deg) translate(9em) rotate(-380deg);
 }
 
-%ring {
-  // border: solid 1px rgb(125 116 153 / 60%);
+.ring-3 > *:nth-of-type(4) {
+  transform: rotate(506.6666666667deg) translate(9em) rotate(-506.6666666667deg);
+}
+
+ul[class^='ring'] {
   background: linear-gradient(
     to bottom right,
     rgba(184, 39, 252, 0.5) 0%,
@@ -270,14 +391,14 @@ ul[class^='ring'] {
   box-sizing: content-box;
 }
 
-%orbiting-object {
+ul[class^='ring'] li:not(.black-hole) {
   display: block;
   position: absolute;
   top: 50%;
   left: 50%;
-  width: $orbitItemSize;
-  height: $orbitItemSize;
-  margin: calc(-1 * $orbitItemSize / 2);
+  width: 1.6em;
+  height: 1.6em;
+  margin: -0.8em;
 }
 
 /*
@@ -293,6 +414,7 @@ ul[class^='ring'] {
   background: transparent;
   border-radius: 50%;
 }
+
 .orbit-center__icon {
   transform: rotateZ(-360deg);
   transition: all 300ms ease-in-out;
@@ -309,7 +431,6 @@ animations
     transform: rotate(360deg);
   }
 }
-
 @keyframes counterClockwiseRotate {
   0% {
     transform: rotate(0deg);
diff --git a/components/TestAction.vue b/components/TestAction.vue
new file mode 100644
index 0000000..46e610a
--- /dev/null
+++ b/components/TestAction.vue
@@ -0,0 +1,12 @@
+<template>
+  <span
+    :id="actionId"
+    data-test-action
+  />
+</template>
+
+<script setup lang="ts">
+defineProps<{
+  actionId: string;
+}>();
+</script>
diff --git a/content/tutorials/cross-chain-governance/10.index.md b/content/tutorials/cross-chain-governance/10.index.md
index 94e3be1..c1b9920 100644
--- a/content/tutorials/cross-chain-governance/10.index.md
+++ b/content/tutorials/cross-chain-governance/10.index.md
@@ -16,7 +16,7 @@ This tutorial shows you how to implement communication between L1 and L2 with th
 - Make sure your machine satisfies the [system
   requirements](https://github.com/matter-labs/era-compiler-solidity/tree/main#system-requirements).
 - You are already familiar with deploying smart contracts on ZKsync Era.
-  If not, please refer to the first section of the [quickstart tutorial](https://docs.zksync.io/build/quick-start).
+  If not, please refer to the first section of the [quickstart tutorial](https://docs.zksync.io/build/start-coding/quick-start).
 - You already have some experience working with Ethereum.
 - A wallet with sufficient Sepolia `%%zk_testnet_currency_symbol%%` on Ethereum and %%zk_testnet_name%% to pay for deploying smart
   contracts. You can get Sepolia ETH from the [network faucets](https://docs.zksync.io/ecosystem/network-faucets).
diff --git a/content/tutorials/cross-chain-governance/30.cross-chain-transactions.md b/content/tutorials/cross-chain-governance/30.cross-chain-transactions.md
index 9d14eed..e71f73f 100644
--- a/content/tutorials/cross-chain-governance/30.cross-chain-transactions.md
+++ b/content/tutorials/cross-chain-governance/30.cross-chain-transactions.md
@@ -213,6 +213,6 @@ Now, let's call the `increment` method on Layer 2 from Layer 1.
 - To learn more about L1->L2 interaction on ZKsync, check out the
   [documentation](https://docs.zksync.io/build/developer-reference/l1-l2-interoperability).
 - To learn more about the `zksync-ethers` SDK, check out its
-  [documentation](https://docs.zksync.io/sdk/js/ethers).
+  [documentation](https://sdk.zksync.io/js/ethers).
 - To learn more about the ZKsync hardhat plugins, check out their
   [documentation](https://docs.zksync.io/build/tooling/hardhat/getting-started).
diff --git a/content/tutorials/custom-zk-chain/10.index.md b/content/tutorials/custom-zk-chain/10.index.md
new file mode 100644
index 0000000..9df1bea
--- /dev/null
+++ b/content/tutorials/custom-zk-chain/10.index.md
@@ -0,0 +1,277 @@
+---
+title: Getting Started with ZK Chains
+description: Create and run your first ZK chain.
+---
+
+This tutorial shows you how to use the `zk_inception` CLI to run an Elastic Chain ecosystem and custom ZK chain locally:
+
+- You'll set up a local **Elastic Chain ecosystem**
+- You'll create a standard **ZK chain**
+- You'll **deploy a smart contract** to your local ZK chain
+- You'll create a second ZK chain that uses a **custom ERC20 base token**
+
+## Prerequisites
+
+- Make sure your machine satisfies the [system
+  requirements](https://github.com/matter-labs/era-compiler-solidity/tree/main#system-requirements).
+- If you aren't already familiar with deploying smart contracts on ZKsync Era, please  refer to the first section of the [quickstart tutorial](https://docs.zksync.io/build/start-coding/quick-start/deploy-your-first-contract).
+- For background on the Elastic Chain or ZK chains, read the [ZK chains](https://docs.zksync.io/zk-stack/concepts/zk-chains) section in our docs.
+- Install the dependencies for the `zksync-era` repo by following the instructions in the matter-labs/zksync-era project's [Setup dev guide](https://github.com/matter-labs/zksync-era/blob/main/docs/guides/setup-dev.md)
+(you can skip the "Environment" section).
+
+::callout{icon="i-heroicons-light-bulb"}
+If you previously have `foundry-zksync` installed,
+reinstall the normal version of [foundry](https://book.getfoundry.sh/getting-started/installation) for this tutorial.
+::
+
+## Installing `zk_inception` CLI
+
+To install the CLI globally, run this command in your root folder.
+You can use the Rust command `cargo` to install the CLI with the command below:
+
+```bash
+cargo install --git https://github.com/matter-labs/zksync-era/ \
+--locked zk_inception --force
+```
+
+::callout{icon="i-heroicons-light-bulb"}
+You can find a full reference for the `zk_inception` CLI in the [`zksync-era` repo](https://github.com/matter-labs/zksync-era/tree/main/zk_toolbox/crates/zk_inception).
+::
+
+## Setting up the Elastic Chain ecosystem
+
+An Elastic Chain ecosystem is, in short, a system to manage multiple ZK chains.
+The vision for the Elastic Chain is an ever-expanding network of ZK rollups, secured by math and natively interoperable under a uniform, intuitive UX.
+New chains can be registered to the ecosystem to scale applications and communities as needed, making it "elastic".
+
+There are two components needed for running a ZK chain locally:
+
+1. An Elastic Chain ecosystem to manage different chains
+2. At least one chain deployed within the ecosystem
+
+To setup both of these components, use the `zk_inception` CLI.
+
+The first step is to create a new ecosystem with the `ecosystem create` command.
+
+::callout{icon="i-heroicons-light-bulb"}
+Make sure Docker is running on your machine.
+::
+
+Move to a directory where you want your ecosystem folder to be, and run the command below to generate an ecosystem folder.
+
+```bash
+zk_inception ecosystem create
+```
+
+You will be prompted with a series of options to customize your ecosystem and generate a new chain within the ecosystem.
+For this tutorial, use the options shown below.
+If you choose different names for your ecosystem or chain, remember to update the names in the commands later on.
+
+```bash
+$ zk_inception ecosystem create
+
+┌   ZKsync toolbox
+│
+◇  What do you want to name the ecosystem?
+│  my_elastic_chain
+│
+◇  Select the origin of zksync-era repository
+│  Clone for me (recommended)
+│
+◇  Select the L1 network
+│  Localhost
+│
+◇  What do you want to name the chain?
+│  zk_chain_1
+│
+◇  Whats the chain id?
+│  271
+│
+◇  Select how do you want to create the wallet
+│  Localhost
+│
+◇  Select the prover mode
+│  NoProofs
+│
+◇  Select the commit data generator mode
+│  Rollup
+│
+◇  Select the base token to use
+│  Eth
+│
+◇  Do you want to start containers after creating the ecosystem?
+│  Yes
+```
+
+By running this command and selecting these options, you just:
+
+- Created a new ecosystem called `my_elastic_chain`, which can contain many chains.
+- Cloned the `zksync-era` repository inside the `my_elastic_chain` folder.
+- Chose to use a local network to act as the L1.
+    This means we'll have to run a local reth node as well (don't worry, the CLI will automatically set this up and run it for you!).
+    We need to do this because our ecosystem contracts need to get deployed on an L1, so we can either use a local L1 chain or the Sepolia testnet.
+    For development purposes, it's easier to use a local L1 chain.
+- Created a new chain called `zk_chain_1` and set it as your default chain.
+- Set the chain id to `271`.
+- Chose the default wallet configuration.
+  This option will use known mnemonic phrases to generate the `wallets.yaml` configuration files for the ecosystem and chain.
+  You can also choose `random` to randomly generate the wallets,
+  `empty` to generate a config file with empty values for the wallets,
+  or `in-file` to set the location of the config to an existing file.
+- Selected to not use proofs, which makes testing more lightweight.
+- Chose a standard rollup for the data availability.
+    You can read more about data availability options for ZK chains in the
+    [ZK chains](https://docs.zksync.io/zk-stack/concepts/zk-chains#data-availability-da) docs.
+- Selected ETH to use as the base token.
+- Started the containers for the ecosystem in Docker.
+
+Inside the generated `my_elastic_chain` folder, you should now have the following contents:
+
+- `ZkStack.yaml`: a configuration file for the ecosystem.
+- `chains`: a folder with configurations for each chain created.
+- `configs`: configuration for the deployments and wallets.
+- `volumes`: dependencies for running local nodes.
+- `zksync-era`: a clone of the `zksync-era` repository.
+- `docker-compose.yml`: a Docker compose file to start up a local environment.
+
+## Deploying the ecosystem
+
+You've just set up your ecosystem and chain, and have two Docker containers running:
+a postgres database for your chain, and a reth node for the local L1 chain.
+
+The L1 chain is already running, but your ecosystem and chain aren't deployed yet.
+The next step is to deploy your ecosystem contracts to the L1 and register your chain to the ecosystem.
+
+Move into the ecosystem folder:
+
+```bash
+cd my_elastic_chain
+```
+
+Next, run the `ecosystem init` command below to deploy the ecosystem:
+
+```bash
+zk_inception ecosystem init --dev
+```
+
+The `--dev` flag will choose the default options for development.
+
+::callout{icon="i-heroicons-light-bulb"}
+If you have any issues at this step, try reinstalling the dependencies at the top.
+::
+
+This process will take some time as there is a lot happening here.
+To see more detailed logs of what is happening at each step, you can add the `--verbose` flag to the command.
+
+To summarize, the `ecosystem init` command:
+
+- Checks to see if your environment has the necessary dependencies.
+- Compiles and deploys all of the necessary contracts for the ecosystem.
+- Deploys `zk_chain_1` to the ecosystem.
+- Sets up a database for the default chain (in this case `zk_chain_1`).
+- Deploys a paymaster contract and some test ERC20 contracts to use for development.
+
+You can find the paymaster contract code deployed to your chain in the `zksync-era` repo in [`contracts/l2-contracts/contracts/TestnetPaymaster.sol`](https://github.com/matter-labs/era-contracts/blob/main/l2-contracts/contracts/TestnetPaymaster.sol),
+and the deployed address inside `<my_elastic_chain>/chains/zk_chain_1/configs/contracts.yaml` at `l2:testnet_paymaster_addr`.
+
+For the ERC20 contracts, you can find the deployed addresses inside `<my_elastic_chain>/configs/erc20.yaml`.
+
+### Understanding the chain configs
+
+Running the `init` command will also modify your chain configuration files in the ecosystem folder.
+
+The main configuration file for `zk_chain_1` can be found in `<my_elastic_chain>/chains/zk_chain_1/ZkStack.yaml`.
+It contains the most basic configurations for the chain.
+
+Inside `<my_elastic_chain>/chains/zk_chain_1/configs`, you can find six more configuration files:
+
+1. `contracts.yaml`: configurations for all the L1 & L2 contracts.
+1. `external_node.yaml`: configurations for the chain's node server.
+1. `general.yaml`: general configurations.
+1. `genesis.yaml`: chain specific configurations with parameters that were used during genesis.
+1. `secrets.yaml`: secrets that are individual for every chain.
+1. `wallets.yaml`: all wallets that you are using for this chain.
+
+::callout{icon="i-heroicons-exclamation-triangle" color="amber"}
+Never commit your private keys or sensitive secrets.
+::
+
+### Starting the chain server
+
+The last step here is to start a server for `zk_chain_1`:
+
+```bash
+zk_inception server
+```
+
+With this, your L1 chain should be running at port `8545`, and the `zk_chain_1` node should be running at port `3050`.
+
+## Funding a wallet on your chain
+
+Because you chose to use a local reth node for your L1 and selected ETH as the base asset,
+you have access to several rich wallets on the L1 that you can use to bridge ETH to `zk_chain_1`.
+
+You can find a full list of rich wallet addresses and their private keys in the [ZKsync docs](https://docs.zksync.io/build/test-and-debug/in-memory-node#pre-configured-rich-wallets).
+
+::callout{icon="i-heroicons-exclamation-triangle" color="amber"}
+Never use these wallets in production or send real funds to them.
+::
+
+Open a new terminal and run the command below to bridge some ETH to `zk_chain_1` using ZKsync CLI:
+
+```bash
+npx zksync-cli bridge deposit --rpc=http://localhost:3050 --l1-rpc=http://localhost:8545
+```
+
+For testing purposes, we'll use one of the rich wallets as both the sender and recipient:
+
+```shell
+? Amount to deposit 10
+? Private key of the sender 0x7726827caac94a7f9e1b160f7ea819f172f7b6f9d2a97f992c38edeab82d4110
+? Recipient address on L2 0x36615Cf349d7F6344891B1e7CA7C72883F5dc049
+```
+
+To see that it worked, let's check the balance of that address on `zk_chain_1`:
+
+```bash
+npx zksync-cli wallet balance \
+--address 0x36615Cf349d7F6344891B1e7CA7C72883F5dc049 \
+--rpc http://localhost:3050
+```
+
+Now this address has ETH available on `zk_chain_1` to use for testing.
+
+## Deploying a contract to chain 1
+
+Now that your chain is deployed and your wallet is funded, let's create a template contract and deploy it to `zk_chain_1`:
+
+Move out of your ecosystem folder and initialize a new hardhat project using ZKsync CLI:
+
+```bash
+npx zksync-cli@latest create --template qs-hello-zksync zk-chain-test
+cd zk-chain-test
+```
+
+Use the same private key for the rich wallet:
+
+```shell
+? Private key of the wallet responsible for deploying contracts (optional)
+0x7726827caac94a7f9e1b160f7ea819f172f7b6f9d2a97f992c38edeab82d4110
+```
+
+In the `hardhat.config.ts` file, change the default network on line 6 to `dockerizedNode`,
+which is already configured to connect to the local chain node running on port `3050`:
+
+```bash
+defaultNetwork: "dockerizedNode",
+```
+
+Finally, compile the contract and run the deploy script:
+
+```bash
+yarn compile && yarn deploy
+```
+
+Nice - you just deployed a contract to your own local ZK chain!
+
+Next, let's take a look at customizing a chain.
diff --git a/content/tutorials/custom-zk-chain/20.customizing-your-chain.md b/content/tutorials/custom-zk-chain/20.customizing-your-chain.md
new file mode 100644
index 0000000..2204601
--- /dev/null
+++ b/content/tutorials/custom-zk-chain/20.customizing-your-chain.md
@@ -0,0 +1,396 @@
+---
+title: Customizing Your ZK Chain
+description: Create a ZK chain with a custom ERC20 base token.
+
+---
+
+One way you can customize your ZK chain is by changing the base token used for gas from ETH to an ERC20 token.
+Let's try customizing a new chain by using a custom ERC20 base token.
+
+With the initial release of ZK stack, custom ERC20 tokens must be added to an allowlist for use as a base token for a chain.
+The allowed addresses are stored and checked in the `BridgeHub` contract on the L1.
+In the future it will be possible to deploy a chain that uses a new custom base token in a permissionless process.
+
+For now, you have the ability to add any tokens to the allowlist in your local ecosystem.
+
+The overall flow for setting up a local chain with a custom base token looks like this:
+
+1. Deploy an ERC20 token to the L1.
+1. Create your new chain that uses the ERC20 token and set it as the default.
+1. Send ERC20 tokens to the ecosystem and chain governor addresses on the L1.
+1. Initialize the new chain in the ecosystem.
+1. Bridge tokens from the L1 to your new chain.
+
+## Deploying an ERC20 token
+
+For the first step of this flow, let's make a new hardhat project.
+
+### Setup
+
+Move out of your previous folder and make a new folder for the ERC20 token contract.
+
+```bash
+mkdir base-token-contract
+cd base-token-contract
+```
+
+Then, run the `hardhat init` command to generate a new project:
+
+```bash
+npx hardhat init
+```
+
+Select the option **Create a Typescript project** and accept the default options for everything else.
+
+Run the command below to install the necessary dependencies:
+
+::code-group
+
+```bash [npm]
+npm i -D typescript ts-node @openzeppelin/contracts @nomicfoundation/hardhat-ethers @typechain/ethers-v6 @typechain/hardhat typechain ethers dotenv
+```
+
+```bash [yarn]
+yarn add -D typescript ts-node @openzeppelin/contracts @nomicfoundation/hardhat-ethers @typechain/ethers-v6 @typechain/hardhat typechain ethers dotenv
+```
+
+::
+
+### Configuring Hardhat
+
+Once installed, replace your existing config in `hardhat.config.ts` with the config below:
+
+```ts
+import { HardhatUserConfig } from "hardhat/config";
+import "@nomicfoundation/hardhat-toolbox";
+
+import dotenv from "dotenv";
+dotenv.config();
+
+const config: HardhatUserConfig = {
+  solidity: "0.8.20",
+  networks: {
+        localRethNode: {
+          url: "http://localhost:8545",
+          accounts: [process.env.WALLET_PRIVATE_KEY as any],
+        },
+      },
+};
+
+export default config;
+```
+
+Now hardhat is configured to connect to our local reth node (the L1) running at local port `8545`.
+For the inital release of the ZK stack, we have to deploy the token to the L1 and bridge to our ZK chain later.
+However, in the future this may change.
+
+Next, create a `.env` file with:
+
+```bash
+touch .env
+```
+
+Add the `WALLET_PRIVATE_KEY` environment variable with the private key of the rich wallet we've been using
+so that we can deploy using a pre-funded address:
+
+```bash
+WALLET_PRIVATE_KEY=0x7726827caac94a7f9e1b160f7ea819f172f7b6f9d2a97f992c38edeab82d4110
+```
+
+### Deploying an ERC20 Contract
+
+Now that we've configured hardhat and the deployer wallet, let's add the contract and deploy script.
+Rename the example generated contract file to `CustomBaseToken.sol`:
+
+```bash
+mv contracts/Lock.sol contracts/CustomBaseToken.sol
+```
+
+Open the `CustomBaseToken.sol` file and replace the example contract with the ERC20 contract below:
+
+```solidity
+// SPDX-License-Identifier: Unlicensed
+pragma solidity ^0.8.20;
+
+import "@openzeppelin/contracts/token/ERC20/ERC20.sol";
+import "@openzeppelin/contracts/access/Ownable.sol";
+import "@openzeppelin/contracts/token/ERC20/extensions/ERC20Burnable.sol";
+
+contract CustomBaseToken is ERC20, Ownable, ERC20Burnable {
+    constructor(string memory name, string memory symbol) ERC20(name, symbol) Ownable(msg.sender) {
+        _mint(msg.sender, 100 * 10 ** decimals());
+    }
+
+    function mint(address to, uint256 amount) public onlyOwner {
+        _mint(to, amount);
+    }
+}
+```
+
+Next, let's update the ignition module to deploy the ERC20 contract.
+Rename the module file with the command below:
+
+```bash
+mv ignition/modules/Lock.ts ignition/modules/CustomBaseToken.ts
+```
+
+Then, replace the module file with the code below:
+
+```ts
+import { buildModule } from "@nomicfoundation/hardhat-ignition/modules";
+
+const CustomBaseTokenModule = buildModule("CustomBaseTokenModule", (m) => {
+  const tokenName = m.getParameter("name", "ZK Base Token");
+  const tokenSymbol = m.getParameter("symbol", "ZKBT");
+
+  const baseToken = m.contract("CustomBaseToken", [tokenName, tokenSymbol]);
+
+  return { baseToken };
+});
+
+export default CustomBaseTokenModule;
+```
+
+To run the module and deploy the token contract, run:
+
+```bash
+npx hardhat ignition deploy ./ignition/modules/CustomBaseToken.ts --network localRethNode
+```
+
+Select `y` to confirm to deploy the contract to the `localRethNode`.
+After deploying, the token contract address should be logged in your console.
+
+The constructor function in the contract should have minted tokens to the deployer address.
+Let's verify that the tokens were minted to the deployer address using the Foundry `cast` CLI:
+
+```bash
+cast balance --erc20 <0xYOUR_TOKEN_ADDRESS> 0x36615Cf349d7F6344891B1e7CA7C72883F5dc049 \
+--rpc-url http://localhost:8545
+```
+
+## Creating a new chain
+
+Now that your ERC20 token is deployed, you can create a new chain.
+
+First, shut down the node server running for `zk_chain_1` by terminating the process.
+
+Move back into your elastic chain ecosystem folder and run the `chain create` command:
+
+```bash
+zk_inception chain create
+```
+
+This time, use the answers below:
+
+```bash
+$ zk_inception chain create
+
+┌   ZKsync toolbox
+│
+◇  What do you want to name the chain?
+│  custom_zk_chain
+│
+◇  What's the chain id?
+│  272
+│
+◇  Select how do you want to create the wallet
+│  Localhost
+│
+◇  Select the prover mode
+│  NoProofs
+│
+◇  Select the commit data generator mode
+│  Rollup
+│
+◇  Select the base token to use
+│  Custom
+│
+◇  What is the token address?
+│  <0x_YOUR_TOKEN_ADDRESS>
+│
+◇  What is the base token price nominator?
+│  1
+│
+◇  What is the base token price denominator?
+│  1
+│
+◇  Set this chain as default?
+│  Yes
+```
+
+The base token nominator and denominator are used to define the relation of the base token price with ETH.
+For example, if we set the nominator to 20 and the denominator to 1, together the relation is 20/1,
+this would mean that 20 tokens would be given the equivalent value as 1 ETH for gas.
+For testing purposes, we'll just use a 1:1 ratio.
+
+### Funding the governor addresses
+
+Now that you have some tokens and created a new chain,
+the next step is to send some to each of the governor's addresses for the ecosystem and chain on the L1.
+This will allow you to register and deploy your chain, and deploy the paymaster.
+For the _ecosystem governor_, you can find the address in `<my_elastic_chain>/configs/wallets.yaml` under `governor`.
+
+The second governor address you need to fund is for the _chain governor_.
+The chain governor address can be found in `<my_elastic_chain>/chains/custom_zk_chain/configs/wallets.yaml` also under `governor`.
+
+Run the command below **twice** (once for each governor address) to use `cast` to transfer some of your ERC20 tokens to the governor's address on the L1.
+
+```bash
+cast send <0xYOUR_TOKEN_ADDRESS> "transfer(address,uint256)" \
+<0x_YOUR_GOVERNOR_ADDRESS> 1000000000000000000 \
+--private-key 0x7726827caac94a7f9e1b160f7ea819f172f7b6f9d2a97f992c38edeab82d4110 \
+--rpc-url http://localhost:8545 \
+--gas-price 30000000000
+```
+
+To verify that this worked, check the balance of both governor addresses:
+
+```bash
+cast balance --erc20 <0xYOUR_TOKEN_ADDRESS> \
+<0x_YOUR_GOVERNOR_ADDRESS> \
+--rpc-url http://localhost:8545
+```
+
+### Initializing the chain
+
+::callout{icon="i-heroicons-exclamation-triangle" color="amber"}
+Make sure the server for `zk_chain_1` that you started in the previous section is shut down.
+::
+
+Next, initialize the chain in the ecosystem with the command below, and select the default options for the prompts.
+
+```bash
+zk_inception chain init
+```
+
+During the initialization process, your ERC20 token address gets added to the allowlist mentioned earlier.
+
+Now that the chain is initialized, you can start the chain server:
+
+```bash
+zk_inception server
+```
+
+## Bridging the base token to your chain
+
+The last step is to bridge some ERC20 tokens from the L1 to the new chain.
+Base tokens can not be minted on the L2 without being backed by the corresponding L1 amount. In the future, there will be more flexibility for this.
+
+Open a new terminal and use ZKsync CLI to bridge the tokens with the command below:
+
+```bash
+npx zksync-cli bridge deposit --token <0x_YOUR_TOKEN_ADDRESS> \
+--rpc=http://localhost:3050 \
+--l1-rpc=http://localhost:8545
+```
+
+```shell
+? Amount to deposit 5
+? Private key of the sender 0x7726827caac94a7f9e1b160f7ea819f172f7b6f9d2a97f992c38edeab82d4110
+? Recipient address on L2 0x36615Cf349d7F6344891B1e7CA7C72883F5dc049
+```
+
+To verify that this worked, let's check the new balance of our address on the L2 chain:
+
+```bash
+npx zksync-cli wallet balance \
+--address 0x36615Cf349d7F6344891B1e7CA7C72883F5dc049 \
+--rpc http://localhost:3050
+```
+
+Note that we aren't checking for any specific token address here.
+The CLI will display the amount as ETH, but in reality, it's our bridged ERC20 tokens.
+
+And that's it! You are now running a local ZK chain that uses a custom ERC20 base token.
+You can follow the steps in the previous section to deploy a contract to the new chain.
+
+## Bridging ETH to your chain
+
+If your ERC20 token bridged to the L2 "acts" like ETH, then what happens if you bridge ETH to your custom chain?
+
+The answer is that if you try to bridge regular ETH to this chain, it will just use a different token contract address.
+
+You can try this out by depositing ETH from the L1 to this new chain:
+
+```bash
+npx zksync-cli bridge deposit \
+--rpc=http://localhost:3050 \
+--l1-rpc=http://localhost:8545
+```
+
+```shell
+? Amount to deposit 20
+? Private key of the sender 0x7726827caac94a7f9e1b160f7ea819f172f7b6f9d2a97f992c38edeab82d4110
+? Recipient address on L2 0x36615Cf349d7F6344891B1e7CA7C72883F5dc049
+```
+
+If you run the previous command to check the base token balance again, note how the balance is still `5`.
+Because ETH is no longer the base token, it has a different token address on L2 you will need to reference.
+To find the L2 token address for ETH, you can use the `l2TokenAddress` method available through `zksync-ethers`.
+
+To try this out, open your hardhat project `zk-chain-test` from the previous section,
+and run the commands below to create a new script file:
+
+```bash
+mkdir scripts
+touch scripts/checkBalance.ts
+```
+
+Next, copy and paste the script below into the `checkBalance.ts` file:
+
+```ts
+import { ETH_ADDRESS_IN_CONTRACTS } from "zksync-ethers/build/utils.js";
+import { getWallet } from "../deploy/utils";
+
+async function main(){
+    const wallet = getWallet();
+    const l2ETHAddress = await wallet.l2TokenAddress(ETH_ADDRESS_IN_CONTRACTS);
+    console.log("L2 ETH Address:", l2ETHAddress);
+
+    const balance = await wallet.getBalance(l2ETHAddress);
+    console.log("L2 ETH Balance 🎉:", balance);
+}
+
+main();
+```
+
+Run the script with the `hardhat run` command:
+
+```bash
+npx hardhat run scripts/checkBalance.ts
+```
+
+You should see the output below showing the same amount of ETH you bridged:
+
+```shell
+L2 ETH Address: <0x_YOUR_ETH_TOKEN_ADDRESS>
+L2 ETH Balance 🎉: 20000000000000000000n
+```
+
+## Switching between chains and shutting down the ecosystem
+
+You can switch in between different chains without losing any state by terminating the chain server process and then running the command below:
+
+```bash
+zk_inception ecosystem change-default-chain
+```
+
+Now when you start the server with `zk_inception server`, the new default chain's node will start with the saved state.
+
+To fully shut down the ecosystem and erase all of the data and state,
+you can shut down the Docker containers from the ecosystem folder using the command:
+
+```bash
+docker-compose down
+```
+
+To restart the docker containers for your ecosystem and run your custom ZK chain again, follow the steps below:
+
+1. In the ecosystem folder, run `zk_inception containers`.
+1. Redeploy your ERC20 contract to the L1.
+1. Update the base token address in `<my_elastic_chain>/chains/custom_zk_chain/configs/contracts.yaml` under `l1.base_token_addr` and in
+  `<my_elastic_chain>/chains/custom_zk_chain/ZkStack.yaml` under `base_token.address`.
+1. Send ERC20 tokens to both of the ecosystem and chain governor addresses.
+1. Initialize the ecosystem with `zk_inception ecosystem init --dev`.
+1. Start the chain server with `zk_inception server`.
+1. Bridge ERC20 tokens from the L1 to L2.
diff --git a/content/tutorials/custom-zk-chain/_dir.yml b/content/tutorials/custom-zk-chain/_dir.yml
new file mode 100644
index 0000000..42ac80c
--- /dev/null
+++ b/content/tutorials/custom-zk-chain/_dir.yml
@@ -0,0 +1,26 @@
+title: Building a Custom ZK Chain
+featured: true
+authors:
+  - name: MatterLabs
+    url: https://matter-labs.io
+    avatar: https://avatars.githubusercontent.com/u/42489169?s=200&v=4
+github_repo: https://github.com/ZKsync-Community-Hub
+tags:
+  - elastic chain
+  - zk chain
+  - tutorial
+summary: Create, customize, and run your first ZK chain locally.
+description:
+  In this tutorial, you will get familiar with the ZK Inception CLI. You will create a local Elastic Chain ecosystem and
+  deploy a contract to a ZK chain. Next, you will create a new ZK chain that uses a custom ERC20 base token.
+what_you_will_learn:
+  - How to create and locally run an Elastic Chain ecosystem.
+  - How to create a ZK chain and deploy a contract to it.
+  - How to setup a ZK chain with a custom base token.
+updated: 2024-08-14
+tools:
+  - zk_inception
+  - hardhat
+  - cast
+  - zksync-cli
+  - zksync-ethers
diff --git a/content/tutorials/daily-spend-limit-account/10.index.md b/content/tutorials/daily-spend-limit-account/10.index.md
index acad792..a6a5b5a 100644
--- a/content/tutorials/daily-spend-limit-account/10.index.md
+++ b/content/tutorials/daily-spend-limit-account/10.index.md
@@ -14,7 +14,7 @@ The daily limit feature prevents an account from spending more ETH than the limi
 - [Node.js](https://nodejs.org/en/download/) and [Yarn](https://classic.yarnpkg.com/lang/en/docs/install/#mac-stable)
   are installed on your machine.
 - You are already familiar with deploying smart contracts on ZKsync Era.
-  If not, please refer to the first section of the [quickstart tutorial](https://docs.zksync.io/build/quick-start).
+  If not, please refer to the first section of the [quickstart tutorial](https://docs.zksync.io/build/start-coding/quick-start).
 - A wallet with sufficient Sepolia `%%zk_testnet_currency_symbol%%` on Ethereum and %%zk_testnet_name%% to pay for deploying smart
   contracts. You can get Sepolia ETH from the [network faucets](https://docs.zksync.io/ecosystem/network-faucets).
   - Get testnet `ETH` for ZKsync Era using [bridges](https://zksync.io/explore#bridges) to bridge funds to ZKsync.
@@ -1118,7 +1118,7 @@ Let's test the `SpendLimit` contract works to make it refuse ETH transfers that
 - To learn more about L1->L2 interaction on ZKsync, check out the
   [documentation](https://docs.zksync.io/build/developer-reference/l1-l2-interoperability).
 - To learn more about the `zksync-ethers` SDK, check out its
-  [documentation](https://docs.zksync.io/sdk/js/ethers).
+  [documentation](https://sdk.zksync.io/js/ethers).
 - To learn more about the ZKsync hardhat plugins, check out their
   [documentation](https://docs.zksync.io/build/tooling/hardhat/getting-started).
 
diff --git a/content/tutorials/dapp-nft-paymaster/10.index.md b/content/tutorials/dapp-nft-paymaster/10.index.md
index 49ca884..3809aa4 100644
--- a/content/tutorials/dapp-nft-paymaster/10.index.md
+++ b/content/tutorials/dapp-nft-paymaster/10.index.md
@@ -30,7 +30,7 @@ completion, you'll have a fully functional `ERC721GatedPaymaster` contract and a
 - Make sure your machine satisfies the [system requirements](https://github.com/matter-labs/era-compiler-solidity/tree/main#system-requirements).
 - A [Node.js](https://nodejs.org/en/download) installation running at minimum Node.js version 16.
 - You are already familiar with deploying smart contracts on ZKsync Era.
-  If not, please refer to the first section of the [quickstart tutorial](https://docs.zksync.io/build/quick-start).
+  If not, please refer to the first section of the [quickstart tutorial](https://docs.zksync.io/build/start-coding/quick-start).
 - Some background knowledge on the concepts covered by the tutorial would be helpful too. Have a look at the following
   docs:
   - [Account abstraction protocol](https://docs.zksync.io/build/developer-reference/account-abstraction/design).
diff --git a/content/tutorials/erc20-paymaster/10.index.md b/content/tutorials/erc20-paymaster/10.index.md
index 5b2aa52..67a4d5e 100644
--- a/content/tutorials/erc20-paymaster/10.index.md
+++ b/content/tutorials/erc20-paymaster/10.index.md
@@ -17,9 +17,7 @@ You will:
 - Make sure your machine satisfies the [system requirements](https://github.com/matter-labs/era-compiler-solidity/tree/main#system-requirements).
 - A [Node.js](https://nodejs.org/en/download) installation running at minimum Node.js version 16.
 - You are already familiar with deploying smart contracts on ZKsync Era.
-  If not, please refer to the first section of the [quickstart tutorial](https://docs.zksync.io/build/quick-start).
-- You are already familiar with deploying smart contracts on ZKsync Era.
-  If not, please refer to the first section of the [quickstart tutorial](https://docs.zksync.io/build/quick-start).
+  If not, please refer to the first section of the [quickstart tutorial](https://docs.zksync.io/build/start-coding/quick-start).
 - Some background knowledge on the concepts covered by the tutorial would be helpful too. Have a look at the following
   docs:
   - [Account abstraction protocol](https://docs.zksync.io/build/developer-reference/account-abstraction/design).
@@ -40,19 +38,26 @@ Atlas is a smart contract IDE that lets you write, deploy, and interact with con
 
 ## Setup the Project
 
-1. Initiate a new project by running the command:
+First, initialize a new project by running the command:
 
-    ```sh
-    npx zksync-cli create custom-paymaster-tutorial --template hardhat_solidity
-    ```
+:test-action{actionId="initialize-hardhat-project"}
 
-    This creates a new ZKsync Era project called `custom-paymaster-tutorial` with a basic `Greeter` contract.
+```sh
+npx zksync-cli create custom-paymaster-tutorial --template hardhat_solidity
+```
 
-1. Navigate into the project directory:
+This creates a new ZKsync Era project called `custom-paymaster-tutorial` with a basic `Greeter` contract.
 
-    ```sh
-    cd custom-paymaster-tutorial
-    ```
+Next, navigate into the project directory and install the dependencies:
+
+:test-action{actionId="wait-for-init"}
+:test-action{actionId="npm-install"}
+
+```sh
+cd custom-paymaster-tutorial && npm install --force
+```
+
+:test-action{actionId="wait-for-install"}
 
 ::callout{icon="i-heroicons-exclamation-circle"}
 The template project includes multiple example contracts. Feel free to delete them.
@@ -213,7 +218,17 @@ _first_ check that the user provided enough allowance before calling `transferFr
 
 ## Paymaster Contract Full Code
 
-Create the `contracts/MyPaymaster.sol` file and copy/paste the following:
+Create the `contracts/MyPaymaster.sol` file with
+
+:test-action{actionId="create-contract-file"}
+
+```sh
+touch contracts/MyPaymaster.sol
+```
+
+and copy/paste the following:
+
+:test-action{actionId="add-paymaster-contract"}
 
 ```solidity
 // SPDX-License-Identifier: MIT
@@ -338,10 +353,18 @@ contract MyPaymaster is IPaymaster {
 
 ## Create ERC20 Contract
 
-For the sake of simplicity we will use a modified OpenZeppelin ERC20 implementation:
+For the sake of simplicity we will use a modified OpenZeppelin ERC20 implementation.
+
+:test-action{actionId="create-erc20-contract-file"}
+
+```sh
+touch contracts/MyERC20.sol
+```
 
 Create the `contracts/MyERC20.sol` file and copy/paste the following:
 
+:test-action{actionId="add-erc20-contract"}
+
 ```solidity [contracts/MyERC20.sol]
 // SPDX-License-Identifier: UNLICENSED
 
@@ -378,7 +401,17 @@ It also mints some `MyERC20` tokens into the account we use to deploy the contra
 In addition, the script sends `0.06ETH` to the paymaster contract so it can pay the transaction fees we send later on.
 
 1. In the `deploy` folder, create the file `deploy-paymaster.ts` and copy/paste the following.
-  Make sure the private key of the account used to deploy the contracts is configured in the `.env` file of the project.:
+
+    :test-action{actionId="create-deploy-file"}
+
+    ```sh
+    touch deploy/deploy-paymaster.ts
+    ```
+
+    Make sure the private key of the account used to deploy the contracts is configured in the `.env` file of the project.
+
+    :test-action{actionId="add-testing-private-key"}
+    :test-action{actionId="add-deploy-script"}
 
     ```ts [deploy-paymaster.ts]
     import { deployContract, getWallet, getProvider } from "./utils";
@@ -416,16 +449,41 @@ In addition, the script sends `0.06ETH` to the paymaster contract so it can pay
 
 1. Compile and the contracts from the project root:
 
-    ```sh
+    :test-action{actionId="create-ts-config"}
+    :test-action{actionId="compile-contracts"}
+
+    ::code-group
+
+    ```bash [npx]
+    npx hardhat compile
+    ```
+
+    ```bash [yarn]
     yarn hardhat compile
     ```
 
+    ::
+
 1. Execute the deployment script:
 
-    ```sh
+    :test-action{actionId="use-local-network"}
+    :test-action{actionId="start-local-network"}
+    :test-action{actionId="wait-for-hh-node"}
+    :test-action{actionId="temp-fix-import"}
+    :test-action{actionId="deploy-contracts"}
+
+    ::code-group
+
+    ```bash [npx]
+    npx hardhat deploy-zksync --script deploy-paymaster.ts
+    ```
+
+    ```bash [yarn]
     yarn hardhat deploy-zksync --script deploy-paymaster.ts
     ```
 
+    ::
+
     The output should be roughly the following:
 
     ```sh
@@ -461,10 +519,18 @@ Make sure you delete the `artifacts-zk` and `cache-zk` folders before recompilin
 
 1. Create the `use-paymaster.ts` script in the `deploy` folder, replacing the parameter placeholders with the details from the previous deploy step.
 
+    :test-action{actionId="create-deploy-paymaster-file"}
+
+    ```sh
+    touch deploy/use-paymaster.ts
+    ```
+
     ::callout{icon="i-heroicons-exclamation-triangle"}
     Make sure you use the private key of the wallet created by the previous script as that wallet contains the ERC20 tokens.
     ::
 
+    :test-action{actionId="add-use-paymaster"}
+
     ```ts [deploy/use-paymaster.ts]
     import { utils, Wallet } from "zksync-ethers";
     import { getWallet, getProvider } from "./utils";
@@ -534,12 +600,25 @@ Make sure you delete the `artifacts-zk` and `cache-zk` folders before recompilin
     }
     ```
 
+    :test-action{actionId="paymaster-address"}
+    :test-action{actionId="token-address"}
+
 1. Run the script:
 
-    ```sh
+    :test-action{actionId="run-use-paymaster"}
+
+    ::code-group
+
+    ```bash [npx]
+    npx hardhat deploy-zksync --script use-paymaster.ts
+    ```
+
+    ```bash [yarn]
     yarn hardhat deploy-zksync --script use-paymaster.ts
     ```
 
+    ::
+
     The output should look something like this:
 
     ```txt
@@ -578,6 +657,6 @@ As a workaround, try including a specific `gasLimit` value in the transaction.
 - To learn more about L1->L2 interaction on ZKsync, check out the
   [documentation](https://docs.zksync.io/build/developer-reference/l1-l2-interoperability).
 - To learn more about the `zksync-ethers` SDK, check out its
-  [documentation](https://docs.zksync.io/sdk/js/ethers).
+  [documentation](https://sdk.zksync.io/js/ethers).
 - To learn more about the ZKsync hardhat plugins, check out their
   [documentation](https://docs.zksync.io/build/tooling/hardhat/getting-started).
diff --git a/content/tutorials/frontend-paymaster/10.index.md b/content/tutorials/frontend-paymaster/10.index.md
index f3a2381..c0c87c7 100644
--- a/content/tutorials/frontend-paymaster/10.index.md
+++ b/content/tutorials/frontend-paymaster/10.index.md
@@ -26,7 +26,7 @@ In this tutorial we're going to:
   directly in our explorer.
   You can also get Sepolia USDC or DAI from [the Aave faucet](https://staging.aave.com/faucet/)
   and then bridge them to ZKsync using [the ZKsync bridge](https://portal.zksync.io/bridge/?network=sepolia).
-- Complete [the ZKsync 101 tutorials](https://docs.zksync.io/build/zksync-101) to deploy a smart contract.
+- Complete [the ZKsync 101 tutorials](https://docs.zksync.io/build/start-coding/zksync-101) to deploy a smart contract.
 
 ## Setup the project
 
@@ -543,7 +543,7 @@ Now you should be able to update the greeting message with ETH or any of the ava
 - For an overview of security and best practices for developing on ZKsync Era,
   refer to the [Security and best practices page](https://docs.zksync.io/build/developer-reference/best-practices).
 - To learn more about the `zksync-ethers` SDK, check out its
-  [documentation](https://docs.zksync.io/sdk/js/ethers).
+  [documentation](https://sdk.zksync.io/js/ethers).
 - To learn more about the ZKsync hardhat plugins, check out their
   [documentation](https://docs.zksync.io/build/tooling/hardhat/getting-started).
 - If you have a project, check out our [migration guide](https://docs.zksync.io/build/tooling/hardhat/migrating-to-zksync).
diff --git a/content/tutorials/guide-dipdup-indexer/_dir.yml b/content/tutorials/guide-dipdup-indexer/_dir.yml
index 2af8361..a6dc21b 100644
--- a/content/tutorials/guide-dipdup-indexer/_dir.yml
+++ b/content/tutorials/guide-dipdup-indexer/_dir.yml
@@ -1,5 +1,5 @@
 title: Create an indexer with DipDup
-featured: true
+featured: false
 authors:
   - name: DipDup
     url: https://dipdup.io
diff --git a/content/tutorials/guide-viem/10.index.md b/content/tutorials/guide-viem/10.index.md
index f327781..18c2546 100644
--- a/content/tutorials/guide-viem/10.index.md
+++ b/content/tutorials/guide-viem/10.index.md
@@ -41,12 +41,14 @@ const client = createPublicClient({
 });
 ```
 
-:::info
+<!-- /*spellchecker: disable*/ -->
+::callout{icon="i-heroicons-information-circle" color="blue"}
 
 - To use the %%zk_testnet_name%%, specify `zkSyncSepoliaTestnet` as the chain.
 - For %%zk_mainnet_name%%, replace `zkSyncSepoliaTestnet` with `zkSync`.
 
-:::
+::
+<!-- /*spellchecker: enable*/ -->
 
 ### Reading Data
 
diff --git a/content/tutorials/guide-web3js/10.index.md b/content/tutorials/guide-web3js/10.index.md
index 014f0d8..08a5691 100644
--- a/content/tutorials/guide-web3js/10.index.md
+++ b/content/tutorials/guide-web3js/10.index.md
@@ -63,10 +63,12 @@ from the `zks_` namespace of the [JSON-RPC API](https://docs.zksync.io/build/api
 
 #### Fetch the Main Contract Address
 
+<!-- /*spellchecker: disable*/ -->
 ```javascript
 const mainContract = await web3.zkSync.rpc.getMainContract();
 console.log(`Main contract: ${mainContract}`);
 ```
+<!-- /*spellchecker: enable*/ -->
 
 ### Wallet Configuration
 
diff --git a/content/tutorials/how-to-deploy-contract/10.index.md b/content/tutorials/how-to-deploy-contract/10.index.md
index bf4d6b6..ffb876e 100644
--- a/content/tutorials/how-to-deploy-contract/10.index.md
+++ b/content/tutorials/how-to-deploy-contract/10.index.md
@@ -9,7 +9,6 @@ using capabilities of Hardhat together with the `hardhat-zksync-deploy` and `har
 ## Prerequisites
 
 - A [Node.js](https://nodejs.org/en/download) installation running at minimum Node.js version 14.
-- Yarn or npm Package Manager
 - Initialized Hardhat TypeScript project
 - A wallet with sufficient Sepolia `%%zk_testnet_currency_symbol%%` on Ethereum and %%zk_testnet_name%% to pay for deploying smart
   contracts. You can get Sepolia ETH from the [network faucets](https://docs.zksync.io/ecosystem/network-faucets).
@@ -28,18 +27,10 @@ Check **hardhat-zksync-deploy** documentation [here](https://docs.zksync.io/buil
 
 To install the **hardhat-zksync-deploy** plugin and additional necessary packages, execute the following command:
 
-::code-group
-
-```bash [yarn]
-yarn add -D @matterlabs/hardhat-zksync-deploy hardhat zksync-ethers ethers
-```
-
 ```bash [npm]
-npm i -D @matterlabs/hardhat-zksync-deploy
+npm install -D @matterlabs/hardhat-zksync-deploy hardhat zksync-ethers ethers
 ```
 
-::
-
 Once installed, add the plugin at the top of the **hardhat.config.ts** file.
 
 ```javascript
@@ -79,18 +70,10 @@ contract SimpleStorage {
 
 Before we continue with the deployment, we must include **hardhat-zksync-solc** plugin in order to compile our contracts.
 
-::code-group
-
 ```bash [npm]
-npm i -D @matterlabs/hardhat-zksync-solc
+npm install -D @matterlabs/hardhat-zksync-solc
 ```
 
-```bash [yarn]
-yarn add -D @matterlabs/hardhat-zksync-solc
-```
-
-::
-
 Add the plugin at the top of the **hardhat.config.ts** file:
 
 ```javascript [hardhat.config.ts]
@@ -145,8 +128,8 @@ Find more details about available configuration options in the [official documen
 
 Execute the following command in your terminal to run the compilation:
 
-```bash
-yarn hardhat compile
+```bash [npm]
+npx hardhat compile
 ```
 
 After successful compilation, you should see the output similar to this:
@@ -216,14 +199,14 @@ export default async function (hre: HardhatRuntimeEnvironment) {
 
 To deploy contract on %%zk_testnet_name%% that we already specified as the default network in our **hardhat.config.ts**, run command:
 
-```bash
-yarn hardhat deploy-zksync
+```bash [npm]
+npx hardhat deploy-zksync
 ```
 
 If you prefer to explicitly select network name within a command, you can run:
 
-```bash
-yarn hardhat deploy-zksync --network zkTestnet
+```bash [npm]
+npx hardhat deploy-zksync --network zkTestnet
 ```
 
 After successful deployment, your console output should look something like this:
@@ -248,18 +231,10 @@ that gives additional methods to use for faster development.
 
 In the root directory of your project, execute this command:
 
-:::code-tabs
-
-```bash [yarn]
-yarn add -D @matterlabs/hardhat-zksync-ethers hardhat zksync-ethers ethers
-```
-
 ```bash [npm]
-npm i -D @matterlabs/hardhat-zksync-ethers
+npm install -D @matterlabs/hardhat-zksync-ethers hardhat zksync-ethers ethers
 ```
 
-:::
-
 Add the plugin at the top of the **hardhat.config.ts** file:
 
 ```javascript [hardhat.config.ts]
@@ -404,7 +379,7 @@ main().catch((error) => {
 To deploy contract, execute command:
 
 ```bash
-yarn hardhat run scripts/deploy-simple-storage-with-name.ts
+npx hardhat run scripts/deploy-simple-storage-with-name.ts
 ```
 
 After successful execution, your console output should look something like this:
@@ -465,8 +440,8 @@ main().catch((error) => {
 
 To deploy contract, execute command:
 
-```bash
-yarn hardhat run scripts/deploy-simple-storage-with-abi-and-bytecode.ts
+```bash [npm]
+npx hardhat run scripts/deploy-simple-storage-with-abi-and-bytecode.ts
 ```
 
 After successful execution, your console output should look something like this:
@@ -515,8 +490,8 @@ main().catch((error) => {
 
 To deploy contract, execute command:
 
-```bash
-yarn hardhat run scripts/deploy-simple-storage.ts
+```bash [npm]
+npx hardhat run scripts/deploy-simple-storage.ts
 ```
 
 After successful execution, your console output should look something like this:
diff --git a/content/tutorials/how-to-test-contracts/10.index.md b/content/tutorials/how-to-test-contracts/10.index.md
index 85f8c8a..b415a6d 100644
--- a/content/tutorials/how-to-test-contracts/10.index.md
+++ b/content/tutorials/how-to-test-contracts/10.index.md
@@ -26,7 +26,7 @@ During the alpha phase, ZKsync Era Test Nodes are currently undergoing developme
 
 First, initialize a new Hardhat TypeScript project:
 
-<span id="initialize-hardhat-project" data-name="runCommand"></span>
+:test-action{actionId="initialize-hardhat-project"}
 
 ```bash
 npx hardhat init
@@ -36,7 +36,7 @@ Select the `Create a TypeScript project` option and install the sample project's
 
 To install the `hardhat-zksync` plugin, execute the following command:
 
-<span id="install-hh-zksync" data-name="runCommand" data-command-folder="tests-output/hardhat-project"></span>
+:test-action{actionId="install-hh-zksync"}
 
 ::code-group
 
@@ -52,8 +52,7 @@ yarn add -D @matterlabs/hardhat-zksync
 
 Once installed, add the plugin at the top of your `hardhat.config.ts` file.
 
-<span id="import-zksync-config" data-name="modifyFile" data-filepath="tests-output/hardhat-project/hardhat.config.ts"
-data-at-line="3"></span>
+:test-action{actionId="import-zksync-config"}
 
 ```ts [hardhat.config.ts]
 import "@matterlabs/hardhat-zksync";
@@ -63,7 +62,7 @@ import "@matterlabs/hardhat-zksync";
 
 You can now safely run the **ZKsync Era Test Node** with the following command:
 
-<span id="run-hh-node" data-name="runCommand" data-command-folder="tests-output/hardhat-project" data-pre-command="bun pm2 start '<COMMAND>' --name hh-zknode"></span>
+:test-action{actionId="run-hh-node"}
 
 ::code-group
 
@@ -77,9 +76,8 @@ yarn hardhat node-zksync
 
 ::
 
-<span id="wait-for-hh-node" data-name="wait" data-timeout="6000"></span>
-
-<span id="test-hh-node" data-name="checkIfBalanceIsZero" data-network-url="http://127.0.0.1:8011" data-address="0xe2b8Cb53a43a56d4d2AB6131C81Bd76B86D3AFe5"></span>
+:test-action{actionId="wait-for-hh-node"}
+:test-action{actionId="test-hh-node"}
 
 ::callout{icon="i-heroicons-exclamation-circle"}
 We'll want to verify the correctness of our installations and test if we can run a **ZKsync Era Test Node**,
@@ -107,8 +105,7 @@ To enable the usage of ZKsync Era Test Node in Hardhat,
 add the `zksync:true` option to the hardhat network in the `hardhat.config.ts` file
 and the `latest` version of `zksolc`:
 
-<span id="zksync-hh-network" data-name="modifyFile" data-filepath="tests-output/hardhat-project/hardhat.config.ts"
-data-at-line="7"></span>
+:test-action{actionId="zksync-hh-network"}
 
 ```ts
 zksolc: {
@@ -128,7 +125,7 @@ it's necessary to use the `hardhat-chai-matchers` plugin.
 
 In the root directory of your project, execute this command:
 
-<span id="install-chai-ethers" data-name="runCommand" data-command-folder="tests-output/hardhat-project" data-pre-command="<COMMAND>"></span>
+:test-action{actionId="install-chai-ethers"}
 
 ::code-group
 
@@ -144,8 +141,7 @@ yarn add -D  @nomicfoundation/hardhat-chai-matchers chai@4.3.6
 
 After installing it, add the plugin at the top of your `hardhat.config.ts` file:
 
-<span id="import-chai-matchers" data-name="modifyFile" data-filepath="tests-output/hardhat-project/hardhat.config.ts"
-data-at-line="4"></span>
+:test-action{actionId="import-chai-matchers"}
 
 ```ts [hardhat.config.ts]
 import "@nomicfoundation/hardhat-chai-matchers";
@@ -153,7 +149,7 @@ import "@nomicfoundation/hardhat-chai-matchers";
 
 With the previous steps completed, your `hardhat.config.ts` file should now be properly configured to include settings for local testing.
 
-<span id="compare-config" data-name="compareToFile" data-filepath="tests-output/hardhat-project/hardhat.config.ts"></span>
+:test-action{actionId="compare-config"}
 
 ```ts [hardhat.config.ts]
 import { HardhatUserConfig } from "hardhat/config";
@@ -182,7 +178,7 @@ To set up the environment for using chai matchers and writing tests, you'll need
 
 Inside the **contracts** folder, rename the example contract file to **Greeter.sol**.
 
-<span id="rename-greeter-file" data-name="runCommand" data-command-folder="tests-output/hardhat-project"></span>
+:test-action{actionId="rename-greeter-file"}
 
 ```bash
 mv contracts/Lock.sol contracts/Greeter.sol
@@ -190,7 +186,7 @@ mv contracts/Lock.sol contracts/Greeter.sol
 
 Now replace the example contract in **Greeter.sol** with the new `Greeter` contract below:
 
-<span id="create-greeter-contract" data-name="writeToFile" data-filepath="tests-output/hardhat-project/contracts/Greeter.sol"></span>
+:test-action{actionId="create-greeter-contract"}
 
 ```solidity [Greeter.sol]
 // SPDX-License-Identifier: MIT
@@ -223,7 +219,7 @@ Now you can create a test with the `hardhat-chai-matchers` plugin:
 
 Inside the `/test` folder, rename the example test file to `test.ts`.
 
-<span id="rename-test-file" data-name="runCommand" data-command-folder="tests-output/hardhat-project"></span>
+:test-action{actionId="rename-test-file"}
 
 ```bash
 mv test/Lock.ts test/test.ts
@@ -231,7 +227,7 @@ mv test/Lock.ts test/test.ts
 
 Replace the old test with this example showcasing the functionalities of the contract:
 
-<span id="create-test" data-name="writeToFile" data-filepath="tests-output/hardhat-project/test/test.ts"></span>
+:test-action{actionId="create-test"}
 
 ```typescript
 import * as hre from "hardhat";
@@ -284,7 +280,7 @@ describe("Greeter", function () {
 
 Execute the following command in your terminal to run the tests:
 
-<span id="run-test" data-name="runCommand" data-command-folder="tests-output/hardhat-project"></span>
+:test-action{actionId="run-test"}
 
 ::code-group
 
diff --git a/content/tutorials/native-aa-multisig/10.index.md b/content/tutorials/native-aa-multisig/10.index.md
index cffe0ef..baedc3a 100644
--- a/content/tutorials/native-aa-multisig/10.index.md
+++ b/content/tutorials/native-aa-multisig/10.index.md
@@ -964,8 +964,8 @@ export default async function (hre: HardhatRuntimeEnvironment) {
 
 ::callout{icon="i-heroicons-light-bulb"}
 ZKsync has different address derivation rules from Ethereum.
-Always use the [`createAddress`](https://docs.zksync.io/sdk/js/ethers/api/v6/utilities/utils#createaddress)
-and [`create2Address`](https://docs.zksync.io/sdk/js/ethers/api/v6/utilities/utils#create2address) utility functions of the `zksync-ethers` SDK.
+Always use the [`createAddress`](https://sdk.zksync.io/js/ethers/api/v6/utilities/utils#createaddress)
+and [`create2Address`](https://sdk.zksync.io/js/ethers/api/v6/utilities/utils#create2address) utility functions of the `zksync-ethers` SDK.
 
 Read the documentation for more information on [address derivation differences between Ethereum and ZKsync](https://docs.zksync.io/build/developer-reference/ethereum-differences/evm-instructions#address-derivation).
 ::
@@ -1206,6 +1206,6 @@ so it has enough funds to pay for the transaction fees.
 - To learn more about L1->L2 interaction on ZKsync, check out the
   [documentation](https://docs.zksync.io/build/developer-reference/l1-l2-interoperability).
 - To learn more about the `zksync-ethers` SDK, check out its
-  [documentation](https://docs.zksync.io/sdk/js/ethers).
+  [documentation](https://sdk.zksync.io/js/ethers).
 - To learn more about the ZKsync hardhat plugins, check out their
   [documentation](https://docs.zksync.io/build/tooling/hardhat/getting-started).
diff --git a/cspell-config/cspell-blockchain.txt b/cspell-config/cspell-blockchain.txt
index dade151..9ea5e40 100644
--- a/cspell-config/cspell-blockchain.txt
+++ b/cspell-config/cspell-blockchain.txt
@@ -42,6 +42,8 @@ Pyth
 Pythnet
 Rabby
 regenesis
+Reth
+reth
 satoshi
 sepolia
 Sepolia
diff --git a/cspell-config/cspell-misc.txt b/cspell-config/cspell-misc.txt
index 2646c5f..3d1513c 100644
--- a/cspell-config/cspell-misc.txt
+++ b/cspell-config/cspell-misc.txt
@@ -97,7 +97,9 @@ vue
 Vue
 Zerion
 zext
+ZKBT
 ZKEVM
+zkicon
 zkout
 zksolc
 zkvyper
diff --git a/nuxt.config.ts b/nuxt.config.ts
index 90a91af..61746ad 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -11,6 +11,12 @@ export default defineNuxtConfig({
       app: 'code',
     },
   },
+  components: [
+    {
+      path: '~/components',
+      global: true,
+    },
+  ],
   content: {
     navigation: {
       fields: [
diff --git a/package.json b/package.json
index fe0d0fa..3edede5 100644
--- a/package.json
+++ b/package.json
@@ -20,16 +20,16 @@
     "release": "semantic-release"
   },
   "dependencies": {
-    "@matterlabs/docs-nuxt-template": "2.3.0",
-    "@nuxt/content": "^2.12.1",
-    "@nuxt/eslint": "^0.3.10",
+    "@matterlabs/docs-nuxt-template": "2.7.0",
+    "@nuxt/content": "^2.13.2",
+    "@nuxt/eslint": "^0.3.13",
     "@nuxt/fonts": "^0.5.1",
     "@nuxt/image": "^1.7.0",
-    "@nuxt/ui": "^2.16.0",
-    "@nuxt/ui-pro": "^1.1.0",
+    "@nuxt/ui": "^2.18.4",
+    "@nuxt/ui-pro": "^1.4.1",
     "@nuxtjs/seo": "^2.0.0-rc.10",
     "dayjs": "^1.11.10",
-    "nuxt": "^3.11.2",
+    "nuxt": "^3.12.4",
     "nuxt-gtag": "^2.0.6",
     "nuxt-headlessui": "^1.2.0",
     "nuxt-og-image": "^3.0.0-rc.53",
@@ -50,6 +50,7 @@
     "lint-staged": "^15.2.4",
     "markdownlint": "^0.34.0",
     "markdownlint-cli2": "^0.13.0",
+    "node-pty": "^1.0.0",
     "pm2": "^5.4.2",
     "prettier": "^3.2.5",
     "prettier-eslint": "^16.3.0",
diff --git a/pages/index.vue b/pages/index.vue
index 62dedc3..cf6353e 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -27,7 +27,7 @@ useSeoMeta({
       :links="[
         {
           label: 'Check out all the tutorials',
-          icon: 'i-zksync-zksync-logo',
+          icon: 'i-zkicon-zksync',
           trailingIcon: 'i-heroicons-arrow-right-20-solid',
           to: '/tutorials',
           size: 'xl',
@@ -39,7 +39,7 @@ useSeoMeta({
         <NuxtImg
           src="/logos/zksync-icon.svg"
           width="240"
-          class="invert filter dark:filter-none"
+          class="mt-[-1em] filter dark:invert"
         />
       </template>
 
diff --git a/pages/tutorials/[...slug].vue b/pages/tutorials/[...slug].vue
index 34beb27..f148239 100644
--- a/pages/tutorials/[...slug].vue
+++ b/pages/tutorials/[...slug].vue
@@ -185,7 +185,7 @@ const communityLinks = [
             </template>
           </div>
         </div>
-        <UDivider icon="i-zksync-zksync-logo" />
+        <UDivider icon="i-zkicon-zksync" />
       </UPage>
 
       <UPage>
diff --git a/pages/tutorials/index.vue b/pages/tutorials/index.vue
index e7ea648..1662766 100644
--- a/pages/tutorials/index.vue
+++ b/pages/tutorials/index.vue
@@ -17,7 +17,7 @@ const guides = computed(() => {
         <UPageHeader
           title="Community Guides"
           description="Explore all the community contributed guides for ZKsync"
-          icon="i-zksync-logo"
+          icon="i-zkicon-zksync"
         />
 
         <ULandingCard
diff --git a/tests/configs/config.ts b/tests/configs/config.ts
new file mode 100644
index 0000000..420c697
--- /dev/null
+++ b/tests/configs/config.ts
@@ -0,0 +1,18 @@
+import { steps as erc20PaymasterSteps } from './erc20-paymaster';
+import { steps as howToTestContractsSteps } from './how-to-test-contracts';
+
+export function getConfig(tutorialName: string) {
+  let steps;
+  switch (tutorialName) {
+    case 'erc20-paymaster':
+      steps = erc20PaymasterSteps;
+      break;
+    case 'how-to-test-contracts':
+      steps = howToTestContractsSteps;
+      break;
+    default:
+      break;
+  }
+
+  return steps;
+}
diff --git a/tests/configs/erc20-paymaster.ts b/tests/configs/erc20-paymaster.ts
new file mode 100644
index 0000000..f070a87
--- /dev/null
+++ b/tests/configs/erc20-paymaster.ts
@@ -0,0 +1,116 @@
+import type { IStepConfig } from '../utils/types';
+
+export const steps: IStepConfig = {
+  'initialize-hardhat-project': {
+    action: 'runCommand',
+    prompts: 'Private key of the wallet:0x7726827caac94a7f9e1b160f7ea819f172f7b6f9d2a97f992c38edeab82d4110|npm: ',
+  },
+  'wait-for-init': {
+    action: 'wait',
+    timeout: 5000,
+  },
+  'npm-install': {
+    action: 'runCommand',
+  },
+  'wait-for-install': {
+    action: 'wait',
+    timeout: 5000,
+  },
+  'create-contract-file': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/custom-paymaster-tutorial',
+  },
+  'add-paymaster-contract': {
+    action: 'writeToFile',
+    filepath: 'tests-output/custom-paymaster-tutorial/contracts/MyPaymaster.sol',
+  },
+  'create-erc20-contract-file': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/custom-paymaster-tutorial',
+  },
+  'add-erc20-contract': {
+    action: 'writeToFile',
+    filepath: 'tests-output/custom-paymaster-tutorial/contracts/MyERC20.sol',
+  },
+  'create-deploy-file': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/custom-paymaster-tutorial',
+  },
+  'add-testing-private-key': {
+    action: 'modifyFile',
+    filepath: 'tests-output/custom-paymaster-tutorial/.env',
+    atLine: 1,
+    removeLines: [1],
+    useSetData: 'WALLET_PRIVATE_KEY=0x7726827caac94a7f9e1b160f7ea819f172f7b6f9d2a97f992c38edeab82d4110',
+  },
+  'add-deploy-script': {
+    action: 'writeToFile',
+    filepath: 'tests-output/custom-paymaster-tutorial/deploy/deploy-paymaster.ts',
+  },
+  'create-ts-config': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/custom-paymaster-tutorial',
+    useSetCommand: 'touch tsconfig.json',
+  },
+  'compile-contracts': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/custom-paymaster-tutorial',
+  },
+  'use-local-network': {
+    action: 'modifyFile',
+    filepath: 'tests-output/custom-paymaster-tutorial/hardhat.config.ts',
+    atLine: 6,
+    removeLines: [6],
+    useSetData: '  defaultNetwork: "inMemoryNode",',
+  },
+  'start-local-network': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/custom-paymaster-tutorial',
+    useSetCommand: "bun pm2 start 'npx hardhat node-zksync' --name hh-zknode",
+  },
+  'wait-for-hh-node': {
+    action: 'wait',
+    timeout: 7000,
+  },
+  'temp-fix-import': {
+    action: 'modifyFile',
+    filepath: 'tests-output/custom-paymaster-tutorial/deploy/utils.ts',
+    atLine: 4,
+    removeLines: [4],
+    useSetData: "import * as dotenv from 'dotenv';",
+  },
+  'deploy-contracts': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/custom-paymaster-tutorial',
+  },
+  'create-deploy-paymaster-file': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/custom-paymaster-tutorial',
+  },
+  'add-use-paymaster': {
+    action: 'writeToFile',
+    filepath: 'tests-output/custom-paymaster-tutorial/deploy/use-paymaster.ts',
+  },
+  'paymaster-address': {
+    action: 'modifyFile',
+    filepath: 'tests-output/custom-paymaster-tutorial/deploy/use-paymaster.ts',
+    atLine: 7,
+    removeLines: [7],
+    getContractId:
+      'tests-output/custom-paymaster-tutorial/deployments-zk/inMemoryNode/contracts/MyPaymaster.sol/MyPaymaster.json',
+    useSetData: "const PAYMASTER_ADDRESS = '<*GET_CONTRACT_ID*>';",
+  },
+  'token-address': {
+    action: 'modifyFile',
+    filepath: 'tests-output/custom-paymaster-tutorial/deploy/use-paymaster.ts',
+    atLine: 10,
+    removeLines: [10],
+    getContractId:
+      'tests-output/custom-paymaster-tutorial/deployments-zk/inMemoryNode/contracts/MyERC20.sol/MyERC20.json',
+    useSetData: "const TOKEN_ADDRESS = '<*GET_CONTRACT_ID*>';",
+  },
+  'run-use-paymaster': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/custom-paymaster-tutorial',
+  },
+};
diff --git a/tests/configs/how-to-test-contracts.ts b/tests/configs/how-to-test-contracts.ts
new file mode 100644
index 0000000..d36c1c2
--- /dev/null
+++ b/tests/configs/how-to-test-contracts.ts
@@ -0,0 +1,68 @@
+import type { IStepConfig } from '../utils/types';
+
+export const steps: IStepConfig = {
+  'initialize-hardhat-project': {
+    action: 'runCommand',
+  },
+  'install-hh-zksync': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/hardhat-project',
+  },
+  'import-zksync-config': {
+    action: 'modifyFile',
+    filepath: 'tests-output/hardhat-project/hardhat.config.ts',
+    atLine: 3,
+  },
+  'run-hh-node': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/hardhat-project',
+    preCommand: "bun pm2 start '<COMMAND>' --name hh-zknode",
+  },
+  'wait-for-hh-node': {
+    action: 'wait',
+    timeout: 7000,
+  },
+  'test-hh-node': {
+    action: 'checkIfBalanceIsZero',
+    networkUrl: 'http://127.0.0.1:8011',
+    address: '0xe2b8Cb53a43a56d4d2AB6131C81Bd76B86D3AFe5',
+  },
+  'zksync-hh-network': {
+    action: 'modifyFile',
+    filepath: 'tests-output/hardhat-project/hardhat.config.ts',
+    atLine: 7,
+  },
+  'install-chai-ethers': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/hardhat-project',
+  },
+  'import-chai-matchers': {
+    action: 'modifyFile',
+    filepath: 'tests-output/hardhat-project/hardhat.config.ts',
+    atLine: 4,
+  },
+  'compare-config': {
+    action: 'compareToFile',
+    filepath: 'tests-output/hardhat-project/hardhat.config.ts',
+  },
+  'rename-greeter-file': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/hardhat-project',
+  },
+  'create-greeter-contract': {
+    action: 'writeToFile',
+    filepath: 'tests-output/hardhat-project/contracts/Greeter.sol',
+  },
+  'rename-test-file': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/hardhat-project',
+  },
+  'create-test': {
+    action: 'writeToFile',
+    filepath: 'tests-output/hardhat-project/test/test.ts',
+  },
+  'run-test': {
+    action: 'runCommand',
+    commandFolder: 'tests-output/hardhat-project',
+  },
+};
diff --git a/tests/erc20-paymaster.spec.ts b/tests/erc20-paymaster.spec.ts
new file mode 100644
index 0000000..358c2d7
--- /dev/null
+++ b/tests/erc20-paymaster.spec.ts
@@ -0,0 +1,12 @@
+import { test } from '@playwright/test';
+import { setupAndRunTest } from './utils/runTest';
+
+test('Build an ERC20 custom paymaster', async ({ page, context }) => {
+  await setupAndRunTest(
+    page,
+    context,
+    'custom-paymaster-tutorial',
+    ['http://localhost:3000/tutorials/erc20-paymaster'],
+    'erc20-paymaster'
+  );
+});
diff --git a/tests/how-to-test-contracts.spec.ts b/tests/how-to-test-contracts.spec.ts
index 94e2944..262b008 100644
--- a/tests/how-to-test-contracts.spec.ts
+++ b/tests/how-to-test-contracts.spec.ts
@@ -1,16 +1,12 @@
 import { test } from '@playwright/test';
-import { setupFolders, stopServers, startLocalServer } from './utils/setup';
-import { runTest } from './utils/runTest';
+import { setupAndRunTest } from './utils/runTest';
 
-test('how-to-test-contracts-with-hardhat', async ({ page, context }) => {
-  // SETUP
-  await startLocalServer(page);
-  await context.grantPermissions(['clipboard-read', 'clipboard-write']);
-  await setupFolders('hardhat-test-example');
-
-  // TEST
-  await runTest(page, 'http://localhost:3000/tutorials/how-to-test-contracts');
-
-  // SHUT DOWN ANY RUNNING PROJECTS
-  stopServers();
+test('How to test smart contracts with Hardhat', async ({ page, context }) => {
+  await setupAndRunTest(
+    page,
+    context,
+    'hardhat-project',
+    ['http://localhost:3000/tutorials/how-to-test-contracts'],
+    'how-to-test-contracts'
+  );
 });
diff --git a/tests/utils/files.ts b/tests/utils/files.ts
index c4be919..c22b96a 100644
--- a/tests/utils/files.ts
+++ b/tests/utils/files.ts
@@ -15,10 +15,21 @@ export async function modifyFile(
   addSpacesBefore?: number,
   addSpacesAfter?: number,
   atLine?: number,
-  removeLines?: string,
-  useSetData?: string
+  removeLines?: number[],
+  useSetData?: string,
+  deploymentFilePath?: string
 ) {
   let contentText = useSetData;
+
+  if (deploymentFilePath) {
+    const contractId = getContractId(deploymentFilePath);
+    if (contentText?.includes('<*GET_CONTRACT_ID*>')) {
+      contentText = contentText.replace('<*GET_CONTRACT_ID*>', contractId);
+    } else {
+      contentText = contractId;
+    }
+  }
+
   if (!contentText) {
     contentText = await clickCopyButton(page, buttonName);
   }
@@ -31,9 +42,8 @@ export async function modifyFile(
   } else {
     const lines = readFileSync(filePath, 'utf8').split('\n');
     if (removeLines) {
-      const removeLinesArray = JSON.parse(removeLines);
-      removeLinesArray.forEach((lineNumber: string) => {
-        lines[Number.parseInt(lineNumber) - 1] = '~~~REMOVE~~~';
+      removeLines.forEach((lineNumber: number) => {
+        lines[lineNumber - 1] = '~~~REMOVE~~~';
       });
     }
     if (atLine) {
@@ -66,3 +76,9 @@ export function compareOutputs(expected: string, actual: string) {
     expect(trimmedLineA).toEqual(trimmedLineB);
   });
 }
+
+function getContractId(deploymentFilePath: string) {
+  const deploymentFile = readFileSync(deploymentFilePath, { encoding: 'utf8' });
+  const json = JSON.parse(deploymentFile);
+  return json.entries[0].address;
+}
diff --git a/tests/utils/getTestActions.ts b/tests/utils/getTestActions.ts
index aba344b..1d303e4 100644
--- a/tests/utils/getTestActions.ts
+++ b/tests/utils/getTestActions.ts
@@ -1,7 +1,7 @@
 import { type Page, expect } from '@playwright/test';
 
 export async function getTestActions(page: Page) {
-  const testActions = await page.$$eval('span[data-name]', (elements: Element[]) => {
+  const testActions = await page.$$eval('span[data-test-action]', (elements: Element[]) => {
     return elements.map((el) => {
       const dataAttributes: {
         [key: string]: string;
diff --git a/tests/utils/runCommand.ts b/tests/utils/runCommand.ts
index 0f70ea5..32e342b 100644
--- a/tests/utils/runCommand.ts
+++ b/tests/utils/runCommand.ts
@@ -3,17 +3,21 @@ import { execSync } from 'node:child_process';
 import { clickCopyButton } from './button';
 import fs from 'fs';
 import { join } from 'path';
+import os from 'os';
+import pty from 'node-pty';
 
 export async function runCommand(
   page: Page,
   buttonName: string,
   goToFolder: string = 'tests-output',
   projectFolder: string = 'hardhat-project',
-  preCommand?: string
+  preCommand?: string,
+  useSetCommand?: string,
+  prompts?: string
 ) {
   const copied = await clickCopyButton(page, buttonName);
   console.log('COPIED', copied);
-  let command = copied;
+  let command = useSetCommand ?? copied;
   const newHardhatProject = command.includes('npx hardhat init');
 
   if (newHardhatProject) {
@@ -31,7 +35,11 @@ export async function runCommand(
       command = `cd ${goToFolder} && ${command}`;
     }
 
-    run(command);
+    if (prompts) {
+      await runWithPrompts(page, command, prompts);
+    } else {
+      run(command);
+    }
   }
 }
 
@@ -77,3 +85,37 @@ function copyFolder(source: string, destination: string) {
 
   copyRecursive(source, destination);
 }
+
+export async function runWithPrompts(page: Page, command: string, prompts: string) {
+  const shell = os.platform() === 'win32' ? 'powershell.exe' : 'bash';
+
+  const ptyProcess = pty.spawn(shell, [], {
+    name: 'xterm-color',
+    cols: 80,
+    rows: 30,
+    cwd: process.cwd(),
+    env: process.env,
+  });
+
+  const promptsArray = prompts.split('|').map((pair) => {
+    const [prompt, answer] = pair.split(':');
+    return { prompt, answer };
+  });
+
+  ptyProcess.onData((data) => {
+    console.log('DATA:', data);
+
+    for (let index = 0; index < promptsArray.length; index++) {
+      const promptObject = promptsArray[index];
+      if (data.includes(promptObject.prompt)) {
+        console.log('FOUND PROMPT:', promptObject.prompt);
+        ptyProcess.write(promptObject.answer + '\r');
+      }
+    }
+  });
+
+  ptyProcess.write(command + '\r');
+
+  await page.waitForTimeout(35000);
+  console.log('waited 35 seconds');
+}
diff --git a/tests/utils/runTest.ts b/tests/utils/runTest.ts
index 90ef725..ba3c81c 100644
--- a/tests/utils/runTest.ts
+++ b/tests/utils/runTest.ts
@@ -1,12 +1,38 @@
-import type { Page } from '@playwright/test';
+import type { BrowserContext, Page } from '@playwright/test';
 
 import { runCommand } from './runCommand';
 import { getTestActions } from './getTestActions';
 import { visit } from './visit';
 import { compareToFile, modifyFile, writeToFile } from './files';
 import { checkIfBalanceIsZero } from './queries';
+import { setupFolders, startLocalServer, stopServers } from './setup';
+import { getConfig } from '../configs/config';
+import type { IStepConfig } from './types';
 
-export async function runTest(page: Page, url: string) {
+export async function setupAndRunTest(
+  page: Page,
+  context: BrowserContext,
+  folderName: string,
+  pageUrls: string[],
+  tutorialName: string
+) {
+  // SETUP
+  await startLocalServer(page);
+  await context.grantPermissions(['clipboard-read', 'clipboard-write']);
+  await setupFolders(folderName);
+
+  const config = getConfig(tutorialName);
+
+  // TEST
+  for (const pageUrl of pageUrls) {
+    await runTest(page, pageUrl, config!);
+  }
+
+  // SHUT DOWN ANY RUNNING PROJECTS
+  stopServers();
+}
+
+export async function runTest(page: Page, url: string, config: IStepConfig) {
   await visit(page, url);
   console.log('GETTING TEST ACTIONS');
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -16,42 +42,47 @@ export async function runTest(page: Page, url: string) {
   for (const step of steps) {
     console.log('STEP:', step);
     await page.waitForTimeout(1000);
-    switch (step['data-name']) {
+    const stepID = step['id'];
+    const stepData = config[stepID];
+    switch (stepData.action) {
       case 'runCommand':
         await runCommand(
           page,
-          step.id,
-          step['data-command-folder'],
-          step['data-project-folder'],
-          step['data-pre-command']
+          stepID,
+          stepData.commandFolder,
+          stepData.projectFolder,
+          stepData.preCommand,
+          stepData.useSetCommand,
+          stepData.prompts
         );
         break;
       case 'wait':
-        await page.waitForTimeout(Number.parseInt(step['data-timeout']));
+        await page.waitForTimeout(stepData.timeout);
         break;
       case 'writeToFile':
-        await writeToFile(page, step.id, step['data-filepath']);
+        await writeToFile(page, stepID, stepData.filepath);
         break;
       case 'modifyFile':
         await modifyFile(
           page,
-          step.id,
-          step['data-filepath'],
-          Number.parseInt(step['data-add-spaces-before']),
-          step['data-add-spaces-after'],
-          Number.parseInt(step['data-at-line']),
-          step['data-remove-lines'],
-          step['data-use-set-data']
+          stepID,
+          stepData.filepath,
+          stepData.addSpacesBefore,
+          stepData.addSpacesAfter,
+          stepData.atLine,
+          stepData.removeLines,
+          stepData.useSetData,
+          stepData.getContractId
         );
         break;
       case 'compareToFile':
-        await compareToFile(page, step.id, step['data-filepath']);
+        await compareToFile(page, stepID, stepData.filepath);
         break;
       case 'checkIfBalanceIsZero':
-        await checkIfBalanceIsZero(step['data-network-url'], step['data-address']);
+        await checkIfBalanceIsZero(stepData.networkUrl, stepData.address);
         break;
       default:
-        console.log('STEP NOT FOUND:', step);
+        console.log('STEP NOT FOUND:', stepData);
     }
   }
 }
diff --git a/tests/utils/types.ts b/tests/utils/types.ts
new file mode 100644
index 0000000..3fa7f34
--- /dev/null
+++ b/tests/utils/types.ts
@@ -0,0 +1,46 @@
+export interface IStepConfig {
+  [key: string]: IStep;
+}
+
+export type IStep = IRunCommand | IWait | IWriteToFile | IModifyFile | ICompareToFile | ICheckIfBalanceIsZero;
+
+export interface IRunCommand {
+  action: 'runCommand';
+  commandFolder?: string;
+  projectFolder?: string;
+  preCommand?: string;
+  useSetCommand?: string;
+  prompts?: string;
+}
+
+export interface IWait {
+  action: 'wait';
+  timeout: number;
+}
+
+export interface IWriteToFile {
+  action: 'writeToFile';
+  filepath: string;
+}
+
+export interface IModifyFile {
+  action: 'modifyFile';
+  filepath: string;
+  addSpacesBefore?: number;
+  addSpacesAfter?: number;
+  atLine?: number;
+  removeLines?: number[];
+  useSetData?: string;
+  getContractId?: string;
+}
+
+export interface ICompareToFile {
+  action: 'compareToFile';
+  filepath: string;
+}
+
+export interface ICheckIfBalanceIsZero {
+  action: 'checkIfBalanceIsZero';
+  networkUrl: string;
+  address: string;
+}