jpswelch / scaffold-eth-typescript

Typescript version of Scaffold-Eth 🏗

🏗 Scaffold-Eth Typescript

Typescript

This is the typescript repo of scaffold-eth and it uses hardhat and vite to run scaffold-eth-typescript. There is also a nextjs version. The directories that you'll use are:

packages/vite-app-ts/
packages/hardhat-ts/
packages/next-app-ts/

Quick Start

Commands to run the app

Running the app

1. install your dependencies, open a new command prompt

   yarn install

2. start a hardhat node

   yarn chain

3. run the app, open a new command prompt

   # build hardhat & external contracts types
   yarn contracts:build
   # deploy your hardhat contracts
   yarn deploy
   # start the app (vite)
   yarn start

4. If you'd like to run the nextjs app, open a new command prompt

   # start nextjs app
   yarn start:nextjs
   

5. other commands

   # rebuild all contracts, incase of inconsistent state
   yarn contracts:rebuild
   # run hardhat commands for the workspace, or see all tasks
   yarn hardhat 'xxx'
   # get eth for testing locally
   yarn hardhat faucet xxx
   # run any subgraph commands for the workspace
   yarn subgraph 'xxx'

   Other folders

   # for subgraph
   packages/advanced/subgraph/
   packages/advanced/services/

Environment Variables

Vite and NextJs app folders have .env files. To create local variables that overrride these, create a file called .env.local, or .env.development.local or .env.production.local and put your overrides in there.

You can set your TARGET_NETWORK with them.

Overview

Everything you need to build on Ethereum! 🚀 Quickly experiment with Solidity using a frontend that adapts to your smart contract:

• 🔏 Edit your smart contract YourContract.sol in packages/hardhat-ts/contracts
• 📝 Edit your frontend MainPage.tsx in packages/vite-app-ts/src
• 💼 Edit your deployment scripts in packages/hardhat-ts/deploy
• 📱 Open http://localhost:3000 to see the app
• 👷🏽‍♂️ run yarn hardhat to get a list of all the tasks. Run yarn hardhat taskname to run the task.

---

Guides

Documentation

• Check out eth-hooks docs for example of how to use hooks

🏃💨 Speedrun Ethereum

Register as a builder here and start on some of the challenges and build a portfolio.

🏁 Make sure to click on the typescript tab!

---

More Information!

📚 Documentation

Documentation, tutorials, challenges, and many more resources, visit: docs.scaffoldeth.io

Eth-hooks documentation is here. Learn how to use the contexts here.

💬 Support Chat

Join the telegram support chat 💬 to ask questions and find others building with 🏗 scaffold-eth!

🛠 Buidl

Check out

• Typescript challenges
• Typescript examples
• Vanilla JS active branches
• Join/fund the 🏰 BuidlGuidl!
• Follow the full Ethereum Speed Run

🔭 Learning Solidity

Read the docs: https://docs.soliditylang.org

Go through each topic from solidity by example editing YourContract.sol in 🏗 scaffold-eth

🙏🏽 Support us!

Please check out our Gitcoin grant too!

🔐 P.S.About keys

You need an RPC and API keys for testnets and production deployments, create an Alchemy account and replace the value of ALCHEMY_KEY = xxx in packages/vite-app-ts/.env or packages/next-app-ts/.env with your new keys.