https://github.com/iotexproject/iotex-dapp-sample
This is a boilerplate template for making your awesome dApp on IoTeX and ETH, BSC, and other EVM compatible chains
https://github.com/iotexproject/iotex-dapp-sample
Last synced: about 1 year ago
JSON representation
This is a boilerplate template for making your awesome dApp on IoTeX and ETH, BSC, and other EVM compatible chains
- Host: GitHub
- URL: https://github.com/iotexproject/iotex-dapp-sample
- Owner: iotexproject
- Archived: true
- Created: 2021-05-28T04:04:37.000Z (about 5 years ago)
- Default Branch: main
- Last Pushed: 2024-07-13T19:46:50.000Z (almost 2 years ago)
- Last Synced: 2025-03-23T14:42:50.223Z (about 1 year ago)
- Language: TypeScript
- Homepage: https://dappsample.iotex.dev/
- Size: 2.53 MB
- Stars: 83
- Watchers: 10
- Forks: 34
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# IoTeX dApp Sample V3
This is a boilerplate template for making your awesome dApp on IoTeX and ETH, BSC, and other possible chains ([request here](https://github.com/iotexproject/iotex-dapp-sample-v2/issues/new))
Technology used in this template are
- [Next](https://github.com/vercel/next.js)
- [React](https://reactjs.org/)
- [TRPC](https://trpc.io/)
- [Typescript](https://www.typescriptlang.org/)
- [Mobx](https://mobx.js.org/README.html)
- [Matine](https://mantine.dev/core/theme-icon/)
- [Cypress](https://www.cypress.io/)
## Intro
A starter for React with Typescript with the fast Vite and the beautiful Matine, tested with the powerful Cypress.
## Cheat Sheet
Here's a cheat sheet list to help you get started quickly
```ts
import { rootStore, useStore } from '@/store/index';
const { god } = useStore();
// or const god = rootStore.god
god.isConnect;
god.currentChain;
god.currentChain.chainId; // for current connected chain id
god.currentChain.Coin; // eth/bnb/iotx
god.currentChain.Coin.balance; // current balance
// ... see ChainState
god.currentNetwork;
god.currentNetwork.account; // for current connected account address
// ... see NetworkState
god.setShowConnecter(); // to show/close the Wallet Selector
god.currentNetwork.loadBalance(); // to load chain coin balance
await rpc('query')({
UniswapRouter: [
{ calls: [{ address: '0x95cB18889B968AbABb9104f30aF5b310bD007Fd8', chainId: 4689 }] },
{
swap: [
{
args: {
sellToken: 'BUSD_b',
buyToken: '0xb8744ae4032be5e5ef9fab94ee9c3bf38d5d2ae0',
buyAmount,
recipient: '0x2AcB8663B18d8c8180783C18b88D60b86de26dF2',
offlinePrice: true
}
},
{
amount: true,
data: true,
router: true,
path: {
address: true,
symbol: true,
decimals: true,
totalSupply: true
}
}
]
}
]
});
```
## Generate sdk
```
$ npm i @smartgraph/cli -g
$ pnpm dev
$ smartgraph codegen -l http://localhost:3000/api/graphql -o ./src/lib
```
## Installation
Clone the repo and run `pnpm install`
## Start
After the successfull installation of the packages: `pnpm dev`