How to build a Chiliz dApp with AI tools

Vibe-coding is all the rage, and it can help you get started quickly with your Web3 project idea even if you don't know how to code!

This page will give you ideas on how to interact with your favorite AI tools in order to obtain the necessary information to generate your dApp using Replit or any other AI code assistant.

Prerequisites

Before you begin, ensure you have the following:

  • A wallet with a Chiliz Chain account, such as MetaMask.

    • Use Spicy Testnet for safe testing, then Chiliz Chain Mainnet for production.

Learn more about Metamask and how to connect it to Spicy Testnet and Chiliz Chain Mainnet here: How to use MetaMask

  • Enough CHZ token on that wallet for deployment.

    • For Chiliz Chain Mainnet, you will need to buy CHZ. You can do so on any crypto exchange, such as Coinbase or Meria.

    • For Spicy Testnet, you will need test CHZ tokens, available from a faucet.

  • An account with an AI code assistant, such as ChatGPT, Gemini, Claude, or any other.

  • A Reown account (to integrate the WalletKit connector).

Find a dApp idea

The first step is to develop a compelling idea. Since you're building on Chiliz Chain, your concept should ideally bridge the gap between blockchain technology and the sports and entertainment world. Think about what fans might want.

A strong idea will have a clear business case: How does it generate value? Who are the users?

Example dApp Idea: A Fan Prediction Market.

  • Concept: Fans can use CHZ to bet on the outcome of upcoming matches (e.g., "Will Team A win against Team B?").

  • Business Case: A small percentage fee (e.g., 2%) is taken from the winning pool upon settlement of a market. This fee is sent to a beneficiary wallet, creating a sustainable revenue stream.

You can use an AI tool to brainstorm and refine your idea.

Once you have a solid concept, it's time to create the smart contract.

Generating the Smart Contract with AI

Modern AI tools are surprisingly capable of writing secure, efficient smart contract code.

Smart contracts are computer programs stored on a blockchain that are automatically executed when predetermined terms and conditions are met. Solidity is one of the main smart contract coding language.

Key Prompting Instructions

When prompting your AI, always be very specific!

Your instructions must include:

  1. Solidity Version: Specify a version at or below 0.8.23. This is because Chiliz Chain does not yet fully support the latest Solidity versions.

  2. Don't reinvent the wheel: Tell the AI to base the contract on existing OpenZeppelin contract(s) as much as possible.

OpenZeppelin is an open-source platform for building secure dApps.

In addition to several security and auditing services, they provide a library of community-vetted smart contract, free for the community to use in their projects. development.

As such, OpenZeppelin contracts are considered industry standards, and you can safely use them.

  1. Flat Contract: Instruct the AI to generate a "flat" contract. This means that the code should be self-contained in a single file and not rely on external imports or dependencies. This simplifies verification later.

  2. Wallet Addresses: Provide the wallet address that will own the contract (the deployer) and the address that will receive any fees (the beneficiary), if any.

Now it's up to you to prompt your AI tool!

After the AI generates the Solidity code, download it if possible, or copy it and save it as a .sol file on your computer.

Compiling and Deploying

You now need to deploy your contract on Chiliz Chain.

We will use Remix IDE, a free, web-based environment, to debug, compile, and deploy your contract:

  1. Open Remix IDE: Navigate to remix.ethereum.org.

  2. Upload your contract: In the "File Explorers" tab on the left, create a new file and paste the Solidity code generated by your AI.

  3. Compile the Contract:

    • Go to the "Solidity Compiler" tab.

    • Set the Compiler version to "0.8.23+xxx".

    • Click the Compile button.

You can see a more detailed Remix deployment guide here:

Deploy with Remix IDE

Debugging with AI

It's common for the initial code to have errors. Remix's debugger is excellent at catching them.

If compilation fails, copy the error message from the Remix console. Go back to your AI tool and ask it to fix the spotted mistakes.

You can use a prompt like this:

"The Solidity code you gave me produced the following error in Remix IDE. Please fix it: ..." and copy paste all error messages from Remix.

Repeat this process of compiling in Remix and getting fixes from your AI until the contract compiles successfully without any errors.

Deploy to Spicy Testnet

Once the smart contract is compiled, you need to deploy it:

  1. Go to the "Deploy & Run Transactions" tab in Remix.

  2. For the Environment, select "Injected Provider - MetaMask". This will prompt your wallet to connect to Remix.

  3. Ensure your MetaMask is connected to Spicy Testnet during your testing phase.

  4. Click the Deploy button in Remix. Your wallet will pop up to ask you to confirm the transaction and pay the gas fee in test CHZ tokens.

After confirming, you should see your deployed contract under the "Deployed Contracts" section in Remix. The transaction will also be available on Chiliscan Spicy.

Verifying the Contract

You now need to verify the smart contract on-chain. A verified contract is transparent and trustworthy. It allows users to read and audit your source code directly on the block explorer.

Here is how to do it with Chiliscan Spicy:

  1. On Chiliscan, find your deployment transaction and copy the new contract's address.

  2. Open the Chiliscan Spicy Contract Verifier.

  3. Fill the Verification Form: You will need to provide several pieces of information.

You can ask your AI tool for help with a prompt like this:

"I need to verify my Solidity smart contract on Chiliscan. The contract address is 0xxxxxxxx. The compiler version I used was 0.8.23. Can you tell me what to put in the fields for ... ?"

  1. Submit the form. If all details are correct, your contract's source code will now be public on Chiliscan!

Building the Frontend with Replit

Now that your smart contract is live and verified, you need a user interface (UI) for people to interact with it. We'll use Replit for this.

  1. Log in to your Replit account.

  2. Start a new project and begin prompting the Replit AI. Be clear about what you want to build.

Example Replit prompt

"I want to build a frontend for my Chiliz Chain dApp. For now I need you to create for Spicy Testnet:

  • RPC endpoint: https://spicy-rpc.chiliz.com/

  • RPC Websocket: wss://spicy-rpc-ws.chiliz.com/

  • Chain ID: 88882

  • Currency Symbol: CHZ

I want my dApp to do this: XXX. Smart Contract Address: [YOUR_DEPLOYED_CONTRACT_ADDRESS] My Wallet Addresses:

  • The owner is [YOUR_OWNER_ADDRESS]

  • The beneficiary is [YOUR_BENEFICIARY_ADDRESS].

Instructions:

  • Create a web interface using using the most common tools for dApps.

  • It should display xxxx.

  • Users should be able to xxxx.

  • The owner should a password-protected admin panel to create xxxx."

  • xxxx"

Be as specific as possible! And don't hesitate to iterate.

Integrating User Wallets

For users to connect their own wallets to your dApp, you'll need a wallet connector solution. Replit can integrate Reown's WalletKit for you.

You will need to create a Reown account:

  1. Sign up for a Reown Cloud account if you haven't already, then connect to it.

  2. Click on "Create Project". Enter the name for your project and click on "Continue".

  3. Select the product as “WalletKit” and click on "Continue".

  4. Select the framework as “Next.js” and click on "Create".

Reown Cloud will now create a new project for you which will also generate a project ID. You will find it on the top left corner: Copy that ID as you will need it later.

Then, instruct Replit to handle the integration.

Example Replit AI Prompt

"Add wallet connection functionality using Reown's WalletKit. I will provide you with my WalletKit project ID and API keys after I create an account. Set it up so that the 'Connect Wallet' button uses WalletKit."

Follow the instructions from Replit and WalletKit to complete the setup. You will need to copy-paste some information from your WalletKit account into your Replit project.

Continue to query and test within the Replit environment until your dApp's frontend is fully functional and you are satisfied with the result.

Moving to Chiliz Chain Mainnet

So far we've asked all AI tools to work with Spicy Testnet in mind. This is essential to test-drive your app on a safe blockchain, but it cannot be used for production project, notably because it only works with test CHZ tokens, not real CHZ tokens.

To move your app from Spicy Testnet to Chiliz Chain Mainnet, you will need to redo most of the above steps one last time:

  1. Deploy your contract with Remix again, but this time with Chiliz Chain Mainnet.

  2. Check that the contract is indeed deployed with Chiliscan Mainnet.

  3. Verify the contract on Chiliscan Mainnet Contract Verifier.

  4. Finally, tell Replit to update the app to use Chiliz Mainnet now. Be specific!

Example Replit prompt

"I want to update the app for Chiliz Chain Mainnet. You must only update the RPC URL and ChainID, nothing else: * RPC endpoint: https://rpc.ankr.com/chiliz * Chain ID: 88888

Final test

Test your app one last time before you share it with anyone else.

That's it! You now have a full-stack, AI-assisted dApp live on Chiliz Chain!

Last updated

Was this helpful?