Add smart contract interaction tutorial under EVM section

.vitepress/config.ts

@@ -248,10 +248,16 @@ function sidebarHome() {
           collapsed: true,
           items: [
             { text: "CosmWasm rollup", link: "/tutorials/cosmwasm" },
-            { text: "Omni Octane EVM rollup", link: "/tutorials/octane-evm" },
-            { text: "Polaris EVM rollup", link: "/tutorials/polaris-evm" },
-	    { text: "BeaconKit EVM", link: "/tutorials/beaconkit" },
-          ],
+	    {
+              text: "EVM",
+	      collapsed: true,
+	      items: [
+                { text: "Omni Octane EVM", link: "/tutorials/octane-evm" },
+	        { text: "BeaconKit EVM", link: "/tutorials/beaconkit" },
+		{ text: "Contract interaction", link: "/tutorials/evm-contract-interaction" },
+              ]
+	    },
+	  ],
         },
       ],
     },

tutorials/beaconkit.md

@@ -71,6 +71,8 @@ You should now see output indicating that your Rollkit node is running, with log
 11:45AM INF beacon block successfully built 🛠️  duration=46.93036ms module=server service=validator slot=40 state_root=0x5f75afde5c6a596fa11c17e8c60ca291ffb31ae5c9a40392e0ceb4d45ab42037
 11:45AM INF received proposal with beacon_block=true blob_sidecars=true module=baseapp service=prepare-proposal
 11:45AM INF no blob sidecars to verify, skipping verifier 🧢 module=server service=blockchain slot=0x28
+11:45AM INF received proposal with beacon_block=true blob_sidecars=true module=baseapp service=prepare-proposal
+11:45AM INF no blob sidecars to verify, skipping verifier 🧢 module=server service=blockchain slot=0x28
 11:45AM INF received incoming beacon block 📫 module=server service=blockchain state_root=0x5f75afde5c6a596fa11c17e8c60ca291ffb31ae5c9a40392e0ceb4d45ab42037
 11:45AM INF calling new payload is_optimistic=false module=server payload_block_hash=0x2ff9329ffecc7f395cb72acb9fd81a6085e5d75101ab14b508f6418fbcd7d0b4 payload_parent_block_hash=0x88081d5e4c48de2f82464f2c8b4b46df8892fe921e5e9b13113ed2a62081d843 service=execution-engine
 11:45AM INF state root verification succeeded - accepting incoming beacon block 🏎️ module=server service=blockchain state_root=0x5f75afde5c6a596fa11c17e8c60ca291ffb31ae5c9a40392e0ceb4d45ab42037
@@ -88,18 +90,35 @@ You should now see output indicating that your Rollkit node is running, with log
 ...
 ```
 
+## Smart Contract Deployment and Interaction
+
+To deploy and interact with smart contracts on the BeaconKit EVM, you can use the tools you are already familiar with, follow our [Contract interaction tutorial](/tutorials/evm-contract-interaction) to get a hands on experience. 
+
+To fund your account with some tokens, modify a Geth genesis file and restart the Geth client:
+Open `$HOME/beacon-kit/testing/files/eth-genesis.json`, and add your account address and balance:
+
+```bash
+"nonce": "0x0000000000000000",
+"timestamp": "0x0",
+"alloc": {
+  "<your address>": { // [!code focus]
+    "balance": "0x12345000000000000000000" // [!code focus]
+  }, // [!code focus]
+  "0x20f33ce90a13a4b5e7697e3544c3083b8f8a51d4": {
+    "balance": "0x123450000000000000000"
+  },
+```
+
 ## Conclusion
 
 Congratulations! You've successfully set up a BeaconKit node using Rollkit, creating your own sovereign rollup. This setup demonstrates the basic functionality of combining BeaconKit with Rollkit.
 
 ## Next Steps
 
 To further customize your rollup chain:
-
-1. Explore the BeaconKit configuration files to adjust parameters.
-2. Experiment with different Rollkit settings to optimize performance.
-3. Consider implementing custom smart contracts on your rollup.
-4. Test the scalability and performance of your rollup under various conditions.
+1. Experiment with different Rollkit settings to optimize performance.
+2. Consider implementing custom smart contracts on your rollup.
+3. Test the scalability and performance of your rollup under various conditions.
 
 ## Troubleshooting
 

tutorials/evm-contract-interaction.md

@@ -0,0 +1,144 @@
+# Smart Contract Interaction on EVM Rollup
+
+In this tutorial, you will deploy a smart contract to your EVM rollup and interact with it on a frontend. This tutorial assumes that you spinned up an EVM rollup, know it's RPC URL, and have funded an account on it.
+
+## Install Foundry
+
+To install Foundry, run the following commands:
+
+```bash
+curl -L https://foundry.paradigm.xyz | bash
+foundryup
+```
+
+## Funds
+
+Here is the private key and derived address of the account for you to be used in this tutorial (make sure to fund it with some ETH):
+
+```bash
+PrivateKey: 0xfffdbb37105441e14b0ee6330d855d8504ff39e705c3afa8f859ac9865f99306
+Address: 0x20f33CE90A13a4b5E7697E3544c3083B8F8A51D4
+```
+
+## Frontend
+
+Now we will make a frontend with a smart contract on our EVM rollup. First, clone the GM Portal repository:
+
+```bash
+cd $HOME
+git clone https://github.com/rollkit/gm-portal.git
+cd gm-portal
+```
+
+### Deploy the ooga booga portal contract
+
+Next, you will deploy the smart contract.
+Export the funded private key and RPC URL:
+
+```bash
+export PRIVATE_KEY=0xfffdbb37105441e14b0ee6330d855d8504ff39e705c3afa8f859ac9865f99306
+export RPC_URL=<rpc url>
+```
+
+Use Foundry to deploy the contract to your EVM:
+
+```bash
+cd contracts
+forge script script/GmPortal.s.sol:GmPortalScript --rpc-url $RPC_URL --private-key $PRIVATE_KEY --broadcast
+```
+
+A successful deployment's output will look similar to:
+
+```bash
+forge script script/GmPortal.s.sol:GmPortalScript --rpc-url $RPC_URL --private-key $PRIVATE_KEY --broadcast
+[⠒] Compiling...
+[⠑] Compiling 18 files with 0.8.20
+[⠘] Solc 0.8.20 finished in 1.52s
+Compiler run successful!
+Script ran successfully.
+
+== Logs ==
+  i am a smart contract on EVM x Rollkit. gm!
+
+[...]
+
+##
+Waiting for receipts.
+⠉ [00:00:00] [######################] 1/1 receipts (0.0s)
+##### 2061
+✅  [Success]Hash: 0xa174e9389633972458e6dce431d84736e0709e9406c1c3b14b5fa9ae0cdd6860
+Contract Address: 0x18Df82C7E422A42D47345Ed86B0E935E9718eBda // [!code focus]
+Block: 682
+Paid: 0.001528707003566983 ETH (509569 gas * 3.000000007 gwei)
+
+[...]
+```
+
+From the contract deployment output, export your contract address:
+
+```bash
+export CONTRACT_ADDRESS=0x18Df82C7E422A42D47345Ed86B0E935E9718eBda
+```
+
+### Interact with the contract
+
+Send an "ooga booga" to the contract:
+
+```bash
+cast send $CONTRACT_ADDRESS \
+"gm(string)" "ooga booga" \
+--private-key $PRIVATE_KEY \
+--rpc-url $RPC_URL
+```
+
+Get total (hex-encoded) GMs (ooga boogas):
+
+```bash
+cast call $CONTRACT_ADDRESS "getTotalGms()" --rpc-url $RPC_URL
+```
+
+### Start and update the frontend
+
+Now, change into the frontend directory:
+
+```bash
+cd $HOME/gm-portal/frontend
+yarn && yarn dev
+```
+
+Now, your frontend is running! We'll display and interact with our smart contract
+on our frontend.
+
+First, you will need to change the contract address on  `gm-portal/frontend/src/App.tsx` to your contract address from above before you can interact with the contract on the frontend:
+
+::: tip
+**Only if you changed the contract**, you will need to update the ABI in `gm-portal/frontend/GmPortal.json` from `gm-portal/contracts/out/GmPortal.sol/GmPortal.json`. This can be done with:
+
+```bash
+cd $HOME
+cp gm-portal/contracts/out/GmPortal.sol/GmPortal.json gm-portal/frontend
+```
+:::
+
+### Interact with the frontend
+
+In order to interact with the contract on the frontend, you'll need to fund an account that you have in your Ethereum wallet
+or add the private key from above into your wallet.
+
+To transfer to an external account, use this command:
+
+```bash
+export RECEIVER=<receiver ETH address>
+cast send --private-key $PRIVATE_KEY $RECEIVER --value 1ether --rpc-url $RPC_URL
+```
+
+_If you are in a different terminal than the one you set the private key in originally,
+you may need to set it again._
+
+Now, login with your wallet that you funded, and post a ooga booga on your ooga booga portal!
+
+![frontend-evm](/frontend-evm.png)
+
+### Conclusion
+
+You have successfully deployed a smart contract to your EVM rollup and interacted with it on a frontend. You can now build more complex applications on your EVM rollup!

tutorials/octane-evm.md

@@ -48,7 +48,22 @@ To start your Omni node with Rollkit and local-DA, execute:
 make devnet-zero-deploy
 ```
 
-Upon execution, the command will set up and start your Omni node. You should see output indicating the progress and status of your node.
+Upon execution, the command will set up and start your Omni node. You should see output indicating the progress and status of your node. Notice the `EVM Chain RPC available` message, which indicates that the Omni node is ready to accept EVM transactions:
+
+```bash
+24-07-22 20:29:03.655 INFO EVM Chain RPC available                  chain_id=1651 chain_name=omni_evm url=http://127.0.0.1:8000
+```
+
+## 🧪 Smart Contract Deployment and Interaction
+
+To deploy and interact with smart contracts on the Omni EVM, you can use the tools you are already familiar with, follow our [Contract interaction tutorial](/tutorials/evm-contract-interaction) to get a hands on experience. 
+
+To fund your account with some tokens, you can use the omni-cli, which needs to be installed first:
+
+```bash
+make install-cli # install omni cli 
+omni devnet fund --rpc-url http://127.0.0.1:8000 --address=<your address>
+``` 
 
 ## 🛑 Stopping the node