Stellar Soroban Boilerplate

In this tutorial I’m going to go through the code for a boilerplate which connects a Soroban smart contract to a React dApp.

Note that for a more full featured demo app you can check out the excellent Scaffold Soroban at: https://developers.stellar.org/docs/learn/interactive/dapps/scaffold-soroban

There is also this from the guys at Palta Labs:
https://create-soroban-dapp.paltalabs.io/

---

The contract is a simple key value data store which includes public set, get, delete functions. We then use the Stellar-SDK within React to connect to this and create this simple little boilerplate to demonstrate how to get data in and out of the Stellar network.

The code for this is open source at: https://github.com/jamesbachini/Stellar-Soroban-Boilerplate

Setup Instructions

To get started let’s fork the repository using GIT. If you haven’t used a package manager before then you can also download the files using the link in the repo.

git clone https://github.com/jamesbachini/Stellar-Soroban-Boilerplate.git
cd Stellar-Soroban-Boilerplate

We can then start the React app in dev mode by running:

npm install
npm start

This will start a live preview in a browser so any changes you make to the code will be updated in real-time in the browser.

---

Deploying The Contract

If you make any changes to the contract you’ll need to redeploy it and update the contractId on line 13 of App.js

Let’s go through the steps to redeploying the contract. If you already have Rust installed you can skip the first line.

curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

rustup target add wasm32-unknown-unknown

cargo install --locked stellar-cli --features opt

stellar network add --global testnet --rpc-url  --network-passphrase "Test SDF Network ; September 2015"

stellar keys generate --global james --network testnet

stellar keys address james

cargo test

cargo build --target wasm32-unknown-unknown --release

stellar contract deploy --wasm target/wasm32-unknown-unknown/release/yourcontract.wasm --source james --network testnet

The final 3 commands run the test suite, then build the contracts compiling them to web assembly before finally deploying them to the network.

---

I hope this provides a useful starting point or demonstration for the hackathon participants.

If you are in London on the 12-13th October then register here: https://bit.ly/stellarhackathon