Skip to content

Latest commit

 

History

History
52 lines (33 loc) · 3.36 KB

README.md

File metadata and controls

52 lines (33 loc) · 3.36 KB

Fourby UI

Fourby is a simple generative art project with a pleasing color palette and dynamic elements to document changes in transaction costs over the course of the mint. Assets are built via SVG and stored 100% on-chain.

This frontend is a Next.js + Foundry + wagmi project bootstrapped with create-wagmi. It also includes RainbowKit for wallet management and several other goodies.

Prerequisites

Install Foundry in order to build your smart contracts. This can be done by running the following command:

curl -L https://foundry.paradigm.xyz | bash

To customize your environment, set up your local .env. An example has been provided in .env.example. At minimum, you'll want to set up the Forge private key and RPC URL. You should also set up a WalletConnect Cloud project ID and an EtherScan API Key at this time.

Variables

Limited edition vs open edition? Set EDITION_SIZE. Time-limited mint? Set BLOCKS_TO_MINT (216000 = ~30d). Free vs paid mint? Set MINT_PRICE (in wei).

Developing with Foundry

Run npm run dev:foundry in your terminal to start. This starts a Next.js dev server and starts @wagmi/cli in watch mode. It also starts an Anvil local development node.

To compile and deploy contracts (in ./contracts) to the Anvil node, run npm run deploy:anvil.

Once you've done both of these things, you should be able to open localhost:3000 in your browser, connect a wallet, and mint an NFT using one of the test accounts that Foundry provides for you (check Anvil output and import the private key into your web wallet).

Deployment

To deploy your contracts to Sepolia, run npm run deploy:sepolia. You'll need to first ensure that your .env file has the appropriate values set. You can create a free account with Alchemy and set the RPC URL to your project there (make sure to also add the API key).

Support for various production blockchains can be added by making a few small adjustments. Add targets to package.jsoon and make sure the appropriate variables exist in your environment.

For frontend hosting, Vercel is a good choice. After setting up an account and installing their CLI, you can simply run the vercel command in the top level directory to deploy a copy of the frontend. Just make sure you deploy the contract first, as the contract address will be cached locally in the config.

One last note: You'll want to set NEXT_PUBLIC_APP_ENV=development if you want testnets to show up in a staging/preview deployment.

Learn more