scaffold-moonshot-starter

Typescript x NextJS x Chakra-UI scaffold-eth production ready starter kit.

Tech stack overview

We are using TypeScript with Next.js & Chakra UI on the front-end.

📁 Folder structure

.
├── packages # Monorepo using yarn workspaces & lerna
│ ├── web # Landing page using NextJS, TypeScript, Chakra-UI
│ ├── dapp # Web3, decentralized app using NextJS, TypeScript, Chakra-UI and ethers.js
│ ├── ui # Theme/design system shared accross web & dapp folders
│ ├── hardhat # Your contracts, using Hardhat with Typechain and ethers v5
│ └── subgraph # A subgraph that gets generated on contract deploys
└── ... config ...

🏄‍♂️ Quick Start

Prerequisites

• Node
• Yarn
• Git
• Account and API key for WEB3.storage (Optional, it provides decentralized media storage)

Setup env

In each package individually, create your .env files by copying the .example.env and fill in the empty values.

$ cd packages/[dapp, hardhat and schemas]
$ cp .example.env .env

Create API Key

Go to https://web3.storage and set the value of WEB3STORAGE_TOKEN with your web3.storage API key.

Clone the starter

$ git clone https://github.com/moonshotcollective/scaffold-moonshot-starter.git

install dependencies

$ cd scaffold-moonshot-starter && yarn install

👷‍ Build your contracts!

run hardhat locally, get some faucet and 🛰 deploy your contract Create a mnemonic.secret file or set one of your dev private key as the DEPLOYER_PRIVATE_KEY environment variables in packages/hardhat/.env

$ cd packages/hardhat
$ yarn chain
$ yarn faucet <YOUR_DEV_ADDRESS>

Deploying on hardhat localhost
$ yarn deploy --network localhost

Deploying on mumbai
$ yarn deploy --network mumbai

Deploying on an other testnet (make sure to edit the hardhat.config.js first)
$ yarn deploy --network mytestnet

Testnet Faucets

• Kovan
• Mumbai
• Rinkeby
• BSC

Dev Preview

Build the ui theme:

$ cd packages/ui
$ yarn build

Build in local

$ cd packages/hardhat-ts
$ yarn chain

Open a new terminal

$ yarn deploy

Start the 📱 dApp:

$ cd packages/dapp
$ yarn dev

Start the 📱 landing page:

(Optional, doesn't need anything else to run)

$ cd packages/web
$ yarn dev