# 3. How to Use Astar WASM IDE

{% embed url="<https://www.youtube.com/watch?v=q-Bf5RHSt4s>" %}

## 1. Choose a Template

Astar WASM IDE offers developers a variety of basic or complex templates, such as Flipper, PSP22, PSP34, Magink-dApp, and more. Click to access a template.

<figure><img src="/files/kTvyPReqp5A5w5rigB0W" alt=""><figcaption></figcaption></figure>

## 2. Write a contract

Upon entering the project, the README.md file included in the folder will be automatically previewed.

<figure><img src="/files/jPSHCBiGl4mGnnaX4QmG" alt=""><figcaption></figcaption></figure>

In the Explorer panel, you can create new files (or folders), refresh the directory, and download files. You can also directly click on the files that come with the template.

<figure><img src="/files/q7FdODIc3oP98GieaQrv" alt=""><figcaption></figcaption></figure>

Click on a contract file to edit the code.

<figure><img src="/files/LFwO2OV0wnVFyczbwTOl" alt=""><figcaption></figcaption></figure>

## 3. Compile a contract

Once the contract code is written, click the "Compiler" button on the right-hand menu to open the compilation module. Choose whether to enable "release" and "nightly" (usually not required), and then click "Build \*\*\*.rs" to initiate the compilation.

> Compiling WASM contracts takes a few minutes, so in the meantime, we can proceed with the next step.

<figure><img src="/files/z4Nfd95X07H9cEDLF58F" alt=""><figcaption></figcaption></figure>

After a successful compilation, the left-hand Explorer panel will display the "target/ink" folder, and within that folder, you will find the "\*\*\*.contract" file (used for deploying the contract).

<figure><img src="/files/YasksD9pfqZKb7Tz36Fq" alt="" width="296"><figcaption></figcaption></figure>

## 4. Connect to Astar WASM

Before deploying a contract, you need to click on "Connect Wallet" in the upper right corner, choose your wallet, and use it to connect to the Astar blockchain.

<figure><img src="/files/xSP5n7LjuOh9tRZHIkDt" alt="" width="217"><figcaption></figcaption></figure>

By default, it's connected to the Shibuya testnet. If you need to switch to another network, you can click on "Shibuya Testnet" in the bottom right corner to change the network.

<figure><img src="/files/pQt6XnT4VLVVWmNr0f8o" alt=""><figcaption></figcaption></figure>

ChainIDE supports switching between four networks: Astar Mainnet, Shibuya Testnet, Shiden Mainnet, and Custom Network.

<figure><img src="/files/Cvy8onDP7hgB23WepfXw" alt="" width="455"><figcaption></figcaption></figure>

### 4.1 Connect to Swanky Node

> Swanky Node is a Substrate-based blockchain designed to facilitate local development of Wasm smart contracts. If you require a substantial amount of tokens for testing and have high-speed interaction requirements, this section is worth exploring.

ChainIDE has integrated a graphical Swanky Node. Click on "Astar Swanky Node" on the right-hand side and then click "Start."

<figure><img src="/files/mrvFPPEGBID3UImd9kOC" alt=""><figcaption></figcaption></figure>

Wait for a few seconds until the Sandbox displays the following two lines.

<figure><img src="/files/z10X2QMVnJXWSUWtZauN" alt="" width="507"><figcaption></figcaption></figure>

Click on the "Jump" link in the Faucet URL to obtain test tokens on the Swanky Node's local network.

<figure><img src="/files/ernGbUu5DpAT9PaWOd6U" alt=""><figcaption></figcaption></figure>

Choose an account with tokens and transfer some tokens to your own wallet.

<figure><img src="/files/kjkq3Gbnajjn9CATG57w" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/b7ymv59FpjyxJsEbbuVZ" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/1oBAflvnVSBrcBiU2z9q" alt=""><figcaption></figcaption></figure>

Return to the ChainIDE for Astar page and copy the WebSocket URL.

<figure><img src="/files/s3VzPVvCPKnVr0RpcxKr" alt=""><figcaption></figcaption></figure>

Refer to [step 3, "Connect to Astar WASM"](#3.-connect-to-astar-wasm),  select "Custom Mode," and enter the WebSocket URL you copied in the previous step. Then, click "Switch."

<figure><img src="/files/hBG1WtTaY9CVZ8UrqmLC" alt="" width="454"><figcaption></figcaption></figure>

Congratulations, you have successfully switched to the Swanky Node local network.

<figure><img src="/files/21DUJsr9xVkDapYVOAIt" alt=""><figcaption></figcaption></figure>

## 5. Deploy a contract

Click the "Deploy & Interaction" button on the right-hand side, which will bring up the deployment and interaction pages. Select the compiled contract, click "Deploy" to initiate the deployment (then confirm in your wallet). After successful contract deployment, the console will display the contract deployment result and relevant information.

<figure><img src="/files/ax3u9BSGHW5xpqHUCxVF" alt=""><figcaption></figcaption></figure>

In addition, you can click on "Import Deployed Contract" to import contracts that have already been deployed, or you can use "On-Chain Contract Code" to deploy contracts using a CodeHash.

<figure><img src="/files/nr3lpgKl72xLOQ5J3vLe" alt="" width="254"><figcaption></figcaption></figure>

## 6. Contract interaction

After a successful contract deployment, you can interact with the contract. Click on the deployed contract, choose the corresponding interface, and click "Submit" or "Get" to perform interactions.

<figure><img src="/files/a8hHTbLeknCIe8XGJBTt" alt=""><figcaption></figcaption></figure>

## 7. Transaction Query

Click on the transaction hash in the Output section to view the specific details of each transaction.

<figure><img src="/files/sNQvJXWcPMOrHTUXlGSj" alt=""><figcaption></figcaption></figure>

## 8. Contract verification

Contracts compiled using ChainIDE can be submitted to Polkaholic for contract verification.

Click the "Scan Verifier" button on the right-hand side, select the network, code hash, and public mode, then click "Publish Verified Code" to initiate the contract verification process.

<figure><img src="/files/fO0h8FH6EwxF0R2HEWig" alt=""><figcaption></figcaption></figure>

## 9. View WASM Developer dashboard

ChainIDE and Polkaholic have collaborated to develop the WASM Developer Dashboard.

Click the "WASM Developer Dashboard" button on the right-hand side to view information such as "Recent Code Stored," "Recent Contracts Instantiated," and "Recent Calls."

<figure><img src="/files/jUgmop6VuanqNSCtvqaO" alt=""><figcaption></figcaption></figure>

## 10. Astar WASM Sandbox

If you prefer command-line development, you can open the Astar WASM Sandbox, which comes pre-loaded with [Swanky Suite](https://docs.astar.network/docs/build/wasm/swanky-suite/), [Git](https://git-scm.com/) and [Node.js V16](https://nodejs.org/en).

<figure><img src="/files/52wjVBWB9J8DJLyilVhM" alt=""><figcaption></figcaption></figure>

ChainIDE facilicates full-stack development. For example, if you use Magink-dApp template, you can not only compile and deploy your smart contracts, but also serve your dApp's frontend via ChainIDE's port forwarding feature. Please refer to [ChainIDE - Port Forwarding](/chainide-english-1/port-forwarding.md).


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://chainide.gitbook.io/chainide-english-1/ethereum-ide-1/12.-astar-ide/3.-how-to-use-astar-wasm-ide.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
