https://github.com/dappsar/buildspace-projects-simple-dapp

Blockchain Projects following buildspace.so step by step
https://github.com/dappsar/buildspace-projects-simple-dapp

blockchain dapp ethereum hardhat javascript reactjs solidity

Last synced: 11 months ago
JSON representation

Blockchain Projects following buildspace.so step by step

• Host: GitHub
• URL: https://github.com/dappsar/buildspace-projects-simple-dapp
• Owner: dappsar
• License: mit
• Created: 2023-01-18T10:18:14.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2023-01-22T16:04:37.000Z (over 3 years ago)
• Last Synced: 2025-04-10T14:13:00.819Z (about 1 year ago)
• Topics: blockchain, dapp, ethereum, hardhat, javascript, reactjs, solidity
• Language: JavaScript
• Homepage:
• Size: 291 KB
• Stars: 2
• Watchers: 2
• Forks: 3
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
[![solidity - v0.8.17](https://img.shields.io/static/v1?label=solidity&message=v0.8.17&color=2ea44f&logo=solidity)](https://github.com/ethereum/solidity/releases/tag/v0.8.17)

[![ethers.js - v5.7.2](https://img.shields.io/static/v1?label=ethers.js&message=v5.7.2&color=2ea44f&logo=ethers.js)](https://github.com/ethers-io/ethers.js/releases/tag/v5.7.2)

[![hardhat - v2.12.6](https://img.shields.io/static/v1?label=hardhat&message=v2.12.6&color=2ea44f&logo=hardhat)](https://github.com/NomicFoundation/hardhat)

# Build an Ethereum dApp

## Introduction

A website that I'll be calling the WavePortal. It'll be a place where anyone on the internet can learn a little about who you are and send you a 👋 + a message and have that data saved on the blockchain through an Ethereum smart contract.

It was developed following the steps in [buildspace.so](https://buildspace.so/).

![sample image app](./images/app.png)

## Live demo

https://waveportal-starter-project.dappsar.repl.co

## Technology Stack & Tools

- Visual Studio Code

- nvm / nodejs / npm / npx

- Javascript (React & Testing)

- Solidity (Writing Smart Contracts & Tests)

- [Hardhat](https://hardhat.org/) (Development Framework)

- [Ethers.js](https://docs.ethers.io/v5/) (Blockchain Interaction)

- [React.js](https://reactjs.org/) (Frontend Framework)

- [Metamask](https://metamask.io/)

- QuickNode

- Replit: It is a browser-based IDE that lets us easily build web apps and deploy them all from the browser. It is super legit. Instead of having to set up a full local environment and write commands to deploy, it's all just given to us.

## Requirements For Initial Setup

- Install [NodeJS](https://nodejs.org/en/). Recommended: Use [nvm](https://github.com/nvm-sh/nvm))

- Register an account and Ethereum Test node in [quicknode](https://www.quicknode.com/)

- Set un .env file in root folder with this content:

    * STAGING_QUICKNODE_KEY=(your quicknode url) 

    * PROD_QUICKNODE_KEY=(nothing)

    * PRIVATE_KEY=(your metamask' acoount private key)

## Setting Up

### 1. Clone/Download the Repository

`$ git clone repo_url`

### 2. Install Dependencies

`$ npm install`

### 3. Run tests

`$ npx hardhat test`

`$REPORT_GAS=true npx hardhat test`

### 4. Start Hardhat node

`$ npx hardhat node`

### 5. Run deployment script

In a separate terminal execute:

`$ npx hardhat run ./scripts/deploy.js --network localhost`

### 6. Start frontend

`$ npm run start`

### 7. Simple run (command line)

`$ npx hardhat run ./scripts/run.js` 

## Links

* [Smart Contract deployed in Goerli Test Blockchain](https://goerli.etherscan.io/address/0x7D2dAeb5DddbD49CB88B0679B8D190bb5561c3dd)

* [NFT earned after finishing project in buildspace.so](https://opensea.io/assets/matic/0x5c4E5ae2ADEAD056fD39badCe6A5A0e4ceBec3Ee/5)