Test and develop DApps on Zilliqa with ZilPay
The promising blockchain Zilliqa has finally released a stable release of their domain-specific functional language, Scilla. However, as you may know not everyone may understand the intricacy of programming smart contracts, therefore there is a certain barrier towards adoption. But! Fret not, as ZilPay is here for the rescue.
ZilPay allows you to easily deploy Zilliqa-based smart contracts and interact with them using the web. Test it yourself and create your very own decentralised applications on just your browser.
If you had past experiences with Ethereum or Tron based dApps, this wallet interface will be very familiar to you.
How does it work?
Example call contract method from dApp.
Let’s go through it step-by-step:
- First, the dApp will create the transaction payload that includes the call contract method specification and send it to content.js via an encrypted stream.
- Second, the content.js will forward this transaction payload to the background.js to prompt a ZilPay popup window for confirmation by the User.
- If the User checks and confirm the transaction payload on the ZilPay wallet. The transaction will then be signed and broadcasted on the Zilliqa network.
If dApp asks the state of the contract then request proxied content.js.
Sample dApps for testing.
You can visit the DApps page to find out more.
Here’s where the fun begins…
Install ZilPay wallet for:
- Chrome
- Firefox
- or manually through GitHub releases
After ZilPay wallet has been installed, the injection scripts will be packaged in it. To check out what’s happening in the background, open up your browser’s developer console.
ZilPay will create a global objects namely `window.zilPay`.
- `window.zilPay` shows the modified Zilliqa-JavaScript-Library Object. and shows current state of wallet.
Deploying contracts from the Scilla Editor.
- Access the Scilla web-based editor.
The left tab is the IDE where you can freely modify the `.scilla` smart contract code. The right tab consists of the `init.json` form which contains the initialisation parameters for the immutable variables in the smart contract. In this case, there are 2 inherent and 1 user-defined immutable variables:
- `_scilla_version` indicates the current version of Scilla this contract is written for.
- `_creation_block` indicates the current block in which the smart contract is going to be deployed.
- `owner` is the user-defined parameter that indicates the contract owner’s account address.
Click `Deploy` button.
Congratulations, you have deployed your first ever Scilla smart contract on the developer testnet.
Frontend
When you are done writing the contract, you will have to call these methods. The frontend of a DApp consists of conventional web technology (i.e. javascipt, html, css). When you deploy a contract on a network (main or test network), you get an address to be able to call it.
Create index.html
- Tag `h2 id = “address”` will be shows your default address
- Tag `button onclick=”getState()”` will fetch the current state of our contract.
- Tag `pre id=”state”` will display the fetched state of our contract.
Let’s start with fetching the contract state, shall we?
JavaScript code:
We can now discover the user.
Let’s now attempt to get the state of our smart contract by creating a new function `getState`.
Now if click to button `getState`, teg pre show you the current state of the smart contract.
Isn’t that wonderful? It is as simple as that. Now, let’s try calling a transition method within our smart contract shall we?
In this demo below, we will attempt to call the transition method `setHello` from the `HelloWorld.scilla` sample contract.
To do so, we simply need to create a new function with the name `setHello`.
Once, you have created this button yourself, try clicking on it and call this function!
This contract deployment transaction will then be broadcasted and we shall wait for it to be accepted and confirmed by the Zilliqa network.
Congratulations! 🎉 You have created your very own dApp on Zilliqa, and this is just your very first attempt.
DApps for test:
- Fungibletoken dApp allows you to easily create and ERC-20 like token via a simple form.
- Unstoppabledomains dApp you manage your domain via ZilPay.
- ROL is a simple competitive game that you can play with your friends :)
- scilla-editor is a simple web-based IDE that allows the User to create and deploy Scilla smart contracts
Summary
ZilPay wallet was created for in order to simplify the creation of Decentralized applications. The code is open-source, so please do feel free to contribute whenever you can!
