ChainIDE for XDC Network offers a user-friendly and intuitive graphic user interface (GUI), streamlining the development process for both novice and experienced developers. Developers can seamlessly navigate through the development environment, reducing the learning curve and allowing them to focus on creating cutting-edge solutions. The following is a tutorial on how to use ChainIDE for XDC.
Visit ChainIDE and click the Try Now button on the front page as shown in the figure below.
Here, you can choose the login method as Github or choose Guest to continue without logging in. For this tutorial, select GitHub login, as later on, the use of the Sandbox requires users to log in with GitHub.
After successfully logging in, you will be able to view all the existing projects or create new projects. Select New Project to create a new XDC chain project.
From the popup window, select "XDC". Then, select a temple to create a new project.
The XDC IDE provides support for two wallets: Metamask and XDCPay 2.0. However, please note that Metamask and XDCPay 2.0 are not compatible. If both wallets are present, only Metamask will be activated.
If you do not have either Metamask or XDCPay 2.0 installed, the download links for each are provided below. Please install one of the wallets before continuing.
The official download website for Metamask is: https://metamask.io/
The official Chrome Web Store address for XDCPay 2.0 is: https://chrome.google.com/webstore/detail/xdcpay-20/iidmfamdbddcbjmemafekkohbnfiblhp
After installing a wallet, please refresh the page.
Click on the Connect Wallet button in the top right corner of the screen and select Injected Web3 Provider to choose the wallet you would like to connect.
After connecting the wallet, Metamask users can follow the prompt in the bottom right corner of the screen to switch their wallet to the XDC Mainnet or Testnet networks.
XDCPay users must switch networks within their wallet to connect to their desired network.
Users can visit https://faucet.apothem.network/ and enter their wallet address to claim test tokens. If you are using Metamask, you must replace the "0x" at the start of your address with "xdc". For example, if your address was 0x82825C3fa24116F6ED719dd1e820DBD952c4D237, you would enter xdc82825C3fa24116F6ED719dd1e820DBD952c4D237 in the "Enter your XDC address" field.
Upon entering the project, the README.md file included in the folder will be automatically previewed.
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.
Click on a contract file to edit the code.
Once your contract code is written, click on the "Compiler" button in the right-side menu to open the compilation module. Choose the compiler version and decide whether to enable optimization, then click "Compile ***.sol" to initiate the compilation.
After successful compilation, the ABI and BYTE CODE will be displayed below, and you'll see a message in the console stating "Compile contract success."
Click the Deploy & Interaction button on the right-hand side, which will bring up the deployment and interaction pages. Select the compiled contract and click Deploy to initiate the deployment (then confirm in Metamask or XDCPay). After successful contract deployment, the console will display the contract deployment result and relevant information.
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.
Click on the transaction hash in the Output section to view the specific details of each transaction.
If the contract to be verified imports other contracts, the following are the steps to create a flattened file for your smart contract:
9.1 Activate the Flattener plugin
9.2 Choose a contract file you want to flatten
Before selecting the contract, you need to compile the contract.
9.3 Save the flattened file to directory under Explorer panel
9.4 View the flattened file and use it for verifying a smart contract
Overall, using ChainIDE's Flattener plug-in can help streamline the development and verification process for your smart contracts, making it easier to ensure that your code is properly organized and ready for verification.
9.5 To verify a smart contract, you need to access the corresponding blockchain explorer. After deploying the contract, click the button below to automatically navigate to the browser page for the corresponding contract
9.6 Click on the verify and publish link shown under the contract section
9.7 Once you click on the verify and publish link, you will be asked for the following:
- Contract Address: The address of a deployed smart contract that you want to verify
- Compiler Type: smart contract language
- Compiler Version: The compiler version that you used to compile the smart contract
9.8 After that, you need to paste the flattened file you created in step 3, enter the contract name, and ensure that the Optimization is either on or off during the compilation process. Then, click Submit, and your smart contract will be verified
9.9 If there are no issues with your smart contract, it would be verified, and you'll be able to see an image similar to the one that is shown below
If you've started a process on a port in the Sandbox and wish to access that port, please refer to ChainIDE - Port Forwarding.
For more information, please refer to ChainIDE for XDC.