scaffold-eth / scaffoldeth.io

Scaffold-ETH 2 landing page

🏗 Scaffold-ETH

🚨🚨 This repository has been archived and is now read-only 🚨🚨

You are still welcome to fork and use as a template but no more changes will be made to this repository.

🎖 Scaffold-ETH 2 is the latest version, we recommend you fork: https://github.com/scaffold-eth/scaffold-eth-2

---

everything you need to build on Ethereum! 🚀

🧪 Quickly experiment with Solidity using a frontend that adapts to your smart contract:

🏄‍♂️ Quick Start

Prerequisites: Node (v18 LTS) plus Yarn (v1.x) and Git

🚨 If you are using a version < v18 you will need to remove openssl-legacy-provider from the start script in package.json

1️⃣ clone/fork 🏗 scaffold-eth:

git clone https://github.com/scaffold-eth/scaffold-eth.git

2️⃣ install and start your 👷‍ Hardhat chain:

cd scaffold-eth
yarn install
yarn chain

3️⃣ in a second terminal window, start your 📱 frontend:

🚨 if your contracts are not deployed to localhost, you will need to update the default network in App.jsx to match your default network in hardhat-config.js.

cd scaffold-eth
yarn start

4️⃣ in a third terminal window, 🛰 deploy your contract:

🚨 if you are not deploying to localhost, you will need to run yarn generate first and then fund the deployer account. To view account balances, run yarn account. You will also need to update hardhat-config.js with the correct default network.

cd scaffold-eth
yarn deploy

🔏 Edit your smart contract YourContract.sol in packages/hardhat/contracts

📝 Edit your frontend App.jsx in packages/react-app/src

💼 Edit your deployment scripts in packages/hardhat/deploy

📱 Open http://localhost:3000 to see the app

🚨📡 To deploy to a public domain, use yarn surge. You will need to have a surge account and have the surge CLI installed. There is also the option to deploy to IPFS using yarn ipfs and yarn s3 to deploy to an AWS bucket 🪣 There are scripts in the packages/react-app/src/scripts folder to help with this.`

📚 Documentation

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

🍦 Other Flavors

• scaffold-eth-typescript
• scaffold-eth-tailwind
• scaffold-nextjs
• scaffold-chakra
• Scaffold-ETH x Buildbear
• eth-hooks
• eth-components
• scaffold-eth-expo
• scaffold-eth-truffle

🔭 Learning Solidity

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

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

• Primitive Data Types
• Mappings
• Structs
• Modifiers
• Events
• Inheritance
• Payable
• Fallback

📧 Learn the Solidity globals and units

🛠 Buidl

Check out all the active branches, open issues, and join/fund the 🏰 BuidlGuidl!

• 🚤 Follow the full Ethereum Speed Run

• 🎟 Create your first NFT

• 🥩 Build a staking smart contract

• 🏵 Deploy a token and vendor

• 🎫 Extend the NFT example to make a "buyer mints" marketplace

• 🎲 Learn about commit/reveal

• ✍️ Learn how ecrecover works

• 👩‍👩‍👧‍👧 Build a multi-sig that uses off-chain signatures

• ⏳ Extend the multi-sig to stream ETH

• ⚖️ Learn how a simple DEX works

• 🦍 Ape into learning!

💌 P.S.

🌍 You need an RPC key for testnets and production deployments, create an Alchemy account and replace the value of ALCHEMY_KEY = xxx in packages/react-app/src/constants.js with your new key.

📣 Make sure you update the InfuraID before you go to production. Huge thanks to Infura for our special account that fields 7m req/day!

🏃💨 Speedrun Ethereum

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

💬 Support Chat

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

---

🙏 Please check out our Gitcoin grant too!

Automated with Gitpod

scaffoldeth.io's Issues

Update Debug Contracts screenshot with Send button instead of Connect Wallet

The "Connect wallet" button it's a bit strange when the sshot shows you are already connected in the top right.

Most users visiting the website won't notice since they don't know the product yet, but I think it would be a good idea to fix it.

For the SE-2 sshot we reused this asset but only with the main image, and modified the buttons to "READ" and "SEND", taking the real UI buttons to replace them.

Review website call to actions and copys

Current call to actions and copys are from design phase, we should review and tweak them a bit for the initial version of the website.

Dark theme

Not a priority, we can first finish the site in light mode.

For reference, I removed the existing dark mode logic here: b126aba

Let's ask Andrea if needed.

Components Section

Update the Custom hooks sections with new API

Description :

This has been changed in scaffold-eth/scaffold-eth-2#700

Add link to the docs in components and hooks sections

Add a link to the docs below section description, with an underlined link: "Check out all the available hooks" / "Check out all the components".

Add git clone box above npx box (until npx is no longer in beta)

At the current state of npx I think we should be a bit conservative and add a box with git clone above the box with npx.

• Add git clone box. Maybe just with git clone line is enough?
  
• Add a daisyui badge with "beta" text to the right of npx box. Example:
  

Hooks section

Let's think about what we want to show there.

As a first iteration, I'll vote for the useScaffoldContractWrite hook. A good example sending some args + value, with a button that does writeAsync onClick.

Question: Should we add a "view all hooks" link or some text like that links to the hooks sections in the docs? Maybe not a primary button, it can be just an underlined link.

Create a custom thumbnail

We are currently using default SE-2 thumbnail. Works well for new sites created with SE-2 until they create their own, but is too generic for Scaffold-ETH 2 website. We should create one specific for the website, like we had on old scaffoldeth.io

Old website thumbnail:

Add Plausible analytics

We did it for bg.com.

BuidlGuidl/buidlguidl.com@404c58e

No need to track any specific link for now. Also, it seems that plausible changed how they handle the custom props that we were sending (e.g. for the click event) and it's not tracking them correctly anymore.

Background Pattern on Hero

Let's add the background pattern on the Hero. Let's start only adding it there (it's present in other sections, but might be too much :D)

Updated Docs URL

Now that we got docs.scaffoldeth.io subdomain pointing to our Docs, we should change button destination

Remove hardcoded numbers (use new ENDPOINT)

https://buidlguidl-v3.ew.r.appspot.com/api/stats