Fun Wallet App

Overview

• Demo wallet app utilizing FunSDK
• Perform simple token swaps between eth / dai / usdc tokens on the goerli ethereum testnet
• Check it out @ https://for-fun-chloe.vercel.app

App use-cases

• User can view their wallet summary
• User can view their individual token balances
• User can perform a token swap using their available balances
• User can choose to view the submitted transaction on a block explorer

Demos

1. Wallet summary

Screen.Recording.2023-05-25.at.12.29.23.AM.mov

3. Performing a token swap

Screen.Recording.2023-05-25.at.1.11.11.AM.mov

4. Unsupported page notices

Screen.Recording.2023-05-25.at.1.30.39.AM.mov

Development setup

First, get the environment variables from @chloe-tan and place them in a .env file in the root folder:

ENV=development
FUN_ADDRESS=SOME_FUN_ADDRESS
FUN_PRIVATE_KEY=SOME_FUN_PRIVATE_KEY
FUN_API_KEY=SOME_FUN_API_KEY
WALLET_INDEX=SOME_WALLET_INDEX
ETHERSCAN_API_KEY=SOME_ETHERSCAN_API_KEY

• You may generate your own ETHERSCAN_API_KEY by creating an etherscan account and following the instructions here

Then, install relevent repo dependencies:

yarn install

Finally, run the development server:

yarn dev

Navigate to http://localhost:3000 with your browser to see the result.

Vercel integration

This app is also automatically deployed on vercel with every new commit to main (production) and/or PRs opened (preview).

Resources & References

1. Process Documentation by @chloe-tan
2. Fun Documentation
3. Fun Demo App Reference
4. Figma Design