3. Astar WASM IDE 使用流程演示

编写 WASM 合约，编译合约，部署，交互和验证

1. 选择模板

Astar WASM IDE 为各位开发者提供了各种基础或复杂的模板，如：Flipper, PSP22, PSP34, Magink-dApp 等。点击即可进入模板。

2. 编写合约

进入项目后，文件夹中自带的 readme.md 文件会自动预览。

在 Explorer 栏中，你可以新建文件（夹），刷新目录，下载文件。也可以直接点击模板中自带的文件。

点击一个合约文件，即可对代码进行编辑操作。

3. 编译合约

合约代码编写完成后，点击右侧菜单栏的 Compiler 按钮打开编译模块，选择是否开启 release 和 nightly (一般不用)，然后点击 Build ***.rs 启动编译。

WASM 合约编译需要几分钟的时间，为此，我们可以先进行下一步

编译成功后，左侧 Explorer 栏会出现 target/ink 文件夹，并且在该文件夹下会出现 ***.contract 文件 （该文件用于部署合约）。

4. 连接 Astar WASM

部署合约前，需要先点击右上角的 Connect Wallet，选择钱包，以此连接到 Astar 区块链上。

默认连接的是 Shibuya 测试网，如果需要切换到其他网络，可以点击右下角的 Shibuya Testnet 进行网络切换。

ChainIDE 支持 Astar 主网， Shibuya 测试网，Shiden 主网和自定义网络，共计4种网络的切换。

4.1 连接到 Swanky Node

Swanky Node 是一个基于 Substrate 的区块链，以帮助 Wasm 智能合约的本地开发。如果你需要大量的代币进行测试，同时对交互速度要求比较高，那么这一小节值得一看。

ChainIDE 已集成了图形化的 Swanky Node，点击右侧的 Astar Swanky Node，并点击 Start。

等待几秒至 Sandbox 出现以下2行字段后。

点击 Faucet UrL 中的跳转键去获取swanky node 本地网上的测试代币。

选择一个有代币的账户向自己钱包转账一些代币。

返回 ChainIDE for Astar 页面，复制 WebSocket Url。

参考3.连接 Astar WASM，选择 Custom Mode，并填入上一步复制的 Websocket URL，点击 Switch。

恭喜你成功切换至 Swanky Node 本地网。

5. 部署合约

点击右侧的 Deploy&Interaction 按钮，出现部署页与交互页面。选择好已编译的合约后，点击 Deploy 进行部署（然后在钱包中点击确认）。合约部署成功后，控制台上会输出现合约部署的结果以及相关信息。

除此之外，你还可以点击 Import Deployed Contract 导入已部署过的合约；Use On-Chain Contract Code 使用 CodeHash 来部署合约。

6. 合约交互

合约部署成功后，可以对合约进行交互操作。点击已部署好的合约，选择对应的接口，点击 Submit 或 Get 进行交互。

7. 交易查询

点击 Output 中的交易 Hash，可以查看每笔交易的具体信息。

8. 合约验证

通过 ChainIDE 编译的合约，可以提交给 Polkaholic 进行合约验证。

点击右侧的 Scan Verifier 按钮，选择 Network，Code Hash，Public Mode 后，点击 Publish Verified Code 即可进行合约验证。

9. 查看仪表盘

ChainIDE 和 Polkaholic 合作开发了 WASM Developer Dashboard。

点击右侧的 WASM Developer Dashboard 按钮，即可查看 Recent Code Stored, Recent Contracts Instantiated 和 Recent Calls 信息。

10. Astar WASM Sandbox

如果你喜欢使用命令行进行开发，可以打开 Astar WASM Sandbox，其中已自带 Swanky Suite, Git and Node.js V16。

ChainIDE 为全栈开发提供了支持。例如，如果您使用 Magink-dApp 模板，您不仅可以编译和部署您的智能合约，还可以通过 ChainIDE 的端口转发功能为您的 dApp 前端提供服务。请参考 ChainIDE-端口转发。