在 XION 上部署一个简单的 dApp

Keep going...

HackQuest 和 XION

强强联合

准备环境

• 安装 Rust
• 安装 Golang
• 设置环境变量

export GOPATH=$(go env GOPATH)
export PATH=$GOPATH/bin:$PATH

• clone XION 到本地, 进入项目根目录执行 make install xiond 命令将安装到您的 $GOPATH 中

能正常打印出版本号，说明都安装成功了

创建和查看密钥

查看

xiond keys list

如果你还没创建，返回的应该是一个空数组。 创建

xiond keys add myFirstXion // myFirstXion 是你的账户名

address 是你的地址， 下面是你助记词，助记词丢了，你的账户里的钱就找不回来了。

查询账户余额 使用账户地址或账户名查询该账户在测试链(你也可以连接到本地节点上)上的余额

xiond query bank balances xion14qvu6j6kdyzw3q5ks6dhaf04ek7wek0uz646kk --node https://rpc.xion-testnet-1.burnt.com:443

xiond query bank balances myFirstXion --node https://rpc.xion-testnet-1.burnt.com:443

新建的账户是没有余额的

领取测试币

discord.gg/burnt 加入 discord, 在 belevation 频道下，执行 /faucet 输入自己的地址，领取测试币。每天只能领取一次。

部署一个合约到测试网

我们用一个现成的项目，进行部署。这是一个简单加减乘除的demo。 cosmwasm-math-demo

• clone 该项目到本地
• 进入根目录执行

cargo wasm

# 优化合约大小
RUSTFLAGS='-C link-arg=-s' cargo wasm

# 在命令行中执行下面三行代码，设置临时环境变量
RPC="https://rpc.xion-testnet-1.burnt.com:443"
export NODE=(--node $RPC)
export TXFLAG=($NODE --chain-id xion-testnet-1 --gas-prices 0.25uxion --gas auto --gas-adjustment 1.4)

# 上传 --from xxx 替换上自己的账号
xiond tx wasm store target/wasm32-unknown-unknown/release/cosmwasm_math.wasm --from myFirstXion $TXFLAG -y --output json

# 查询 code_id 换上自己的 txHash
RESP=$(xiond q tx C11556D6A214DCB3655102A4D9631F0AA65EAEDABBA2BCBD676E57273A2DB62D -o json $NODE)

CODE_ID=$(echo "$RESP" | jq -r '.events[]| select(.type=="store_code").attributes[]| select(.key=="code_id").value')
echo $CODE_ID

这里可能遇到的问题， rust 需要是 1.81.0 的版本

jq is not command. 使用 brew install jq

查询合约地址

# 参数
INIT='{}'

# 实例化
xiond tx wasm instantiate $CODE_ID "$INIT" --from myFirstXion --label "initialize cosmwasm math contract" $TXFLAG -y --no-admin

# 查询合约地址
xiond query wasm list-contract-by-code $CODE_ID $NODE --output json

与合约交互

与和约交互的方式很多

• 命令行直接交互

# 参数
EXECMSG='{"operations":{"a":"5","b":"2"}}'
CONTRACT='xion187kwra4nkua7pzucaguaru3fuy2t28vstulnwv5udv39kfgq2w3qw0jxnp'

# 计算
xiond tx wasm execute $CONTRACT "$EXECMSG" --amount 100uxion --from demo $TXFLAG -y

# 参数
QUERYMSG='{"get_response":{}}'

# 查询
xiond query wasm contract-state smart $CONTRACT "$QUERYMSG" $NODE --output json

到 explorer 上查看交互记录 explorer.burnt.com/xion-testne…

• dApp 的形式与合约交互

使用模版快速创建一个项目

npx create-next-app@latest nextjs-xion-abstraxion-example --use-npm --ts --eslint --tailwind --app  --src-dir --import-alias "@/*"

进入项目并安装依赖

cd nextjs-xion-abstraxion-example
pnpm add @burnt-labs/abstraxion

运行项目

pnpm run dev

在我们开始在应用程序中设置 Abstraxion SDK 之前，我们将在此处部署一个财务合约

• 登录开发者门户
• 点击 New Treasury

• 选择适当的配置

这里填的合约地址是上面，部署到测试网上的合约地址

点击 ADD 和 ENCODE 之后

创建成功后

点击后查看详情

这里就获取了 Treasury Contract

项目中配置上自己的 treasury contract 和 自己部署的 contract

layout.tsx

page.tsx

运行项目后， connect 上自己的账号， 然后点击 Claim seat

通过生成的 txHash 到 explorer 上查询结果