dappuniversity/millow

Real Estate NFT DApp

Real Estate NFT DApp

Technology Stack & Tools

• Solidity (Writing Smart Contracts & Tests)
• Javascript (React & Testing)
• Hardhat (Development Framework)
• Ethers.js (Blockchain Interaction)
• React.js (Frontend Framework)

Requirements For Initial Setup

• Install NodeJS

Setting Up

1. Clone/Download the Repository

2. Install Dependencies:

$ npm install

3. Run tests

$ 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

7. Start frontend

$ npm run start

millow's Issues

npm ERR! ENOTEMPTY

Hi, I get the following error when i try to do npm install after cloning the starter_code branch.
Any help?

npm ERR! code ENOTEMPTY
npm ERR! syscall rename
npm ERR! path /Users/user/Develop/iampapagray/millow/node_modules/chai
npm ERR! dest /Users/user/Develop/iampapagray/millow/node_modules/.chai-ioYsTChA
npm ERR! errno -66
npm ERR! ENOTEMPTY: directory not empty, rename '/Users/user/Develop/iampapagray/millow/node_modules/chai' -> '/Users/user/Develop/iampapagray/millow/node_modules/.chai-ioYsTChA'

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/user/.npm/_logs/2023-01-11T08_59_47_070Z-debug-0.log

Node Version: v18.13.0
Npm Version: 8.19.3

System: macOS Monterey 12.6.2

how to deploy on sepolia testnet instead of hardhat localhost?

i'm trying to deploy my contract on ethereum sepolia network but encountered this error:

Error: sending a transaction requires a signer (operation="sendTransaction", code=UNSUPPORTED_OPERATION, version=contracts/5.7.0)

i have added const signer = provider.getSigner(); according to this answer on stackoverflow but the error is still there, here's my App.js code:

...
  const loadBlockchainData = async () => {
try {
      const provider = new ethers.providers.Web3Provider(window.ethereum)
      setProvider(provider)
      const signer = provider.getSigner();
      const network = await provider.getNetwork()
      const chainId = network.chainId;
      const contractAddresses = config[chainId];
      if(!contractAddresses) {
        throw new Error(`No contract deployed to chain with id ${chainId}`);
      }
  
      const carbonCredit = new ethers.Contract(config[network.chainId].carbonCredit.address, CarbonCredit, provider)
      const totalSupply = await carbonCredit.totalSupply()
      const credits = []
  
      for (var i = 1; i <= totalSupply; i++) {
        const uri = await carbonCredit.tokenURI(i)
        const response = await fetch(uri)
        const metadata = await response.json()
        credits.push(metadata)
      }
  
      setCredits(credits)
  
      const escrow = new ethers.Contract(config[network.chainId].escrow.address, Escrow, provider)
      setEscrow(escrow)
  
      window.ethereum.on('accountsChanged', async () => {
        const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' });
        const account = ethers.utils.getAddress(accounts[0])
        setAccount(account);
      })
} catch (error) {
  console.error("Error loading blockchain data", error);
}
  }

  useEffect(() => {
    loadBlockchainData()
  }, [])
...

can anyone help me with this? i'm more than happy to provide more related code if you ask, any help would be awesome

git -b clone

git clone -b starter-code https://github.com/dappuniversity/millow
Cloning into 'millow'...
fatal: Remote branch starter-code not found in upstream origin

npm run start not working

C:\Users\Icon\OneDrive\Documents\edi3project\real-estate-nft-main>npm run start
npm WARN config global --global, --local are deprecated. Use --location=global instead.
npm ERR! Missing script: "start"
npm ERR!
npm ERR! Did you mean one of these?
npm ERR! npm star # Mark your favorite packages
npm ERR! npm stars # View packages marked as favorites
npm ERR!
npm ERR! To see a list of scripts, run:
npm ERR! npm run

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Icon\AppData\Local\npm-cache_logs\2023-10-07T06_30_04_213Z-debug-0.log

i have download this project repo from github but when i run given commond it give me error.

$ npm i
npm WARN deprecated [email protected]: Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility
npm WARN deprecated [email protected]: this library is no longer supported
npm WARN deprecated [email protected]: request-promise-native has been deprecated because it extends the now deprecated request package, see request/request#3142
npm WARN deprecated [email protected]: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details.
npm WARN deprecated [email protected]: request has been deprecated, see request/request#3142
npm WARN deprecated [email protected]: This SVGO version is no longer supported. Upgrade to v2.x.x.
npm ERR! code ERR_SOCKET_TIMEOUT
npm ERR! network Socket timeout
npm ERR! network This is a problem related to network connectivity.
npm ERR! network In most cases you are behind a proxy or have bad network settings.
npm ERR! network
npm ERR! network If you are behind a proxy, please make sure that the
npm ERR! network 'proxy' config is set properly. See: 'npm help config'

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\ADMIN\AppData\Local\npm-cache_logs\2022-12-01T10_56_00_786Z-debug-0.log

can we contribute this repo !?

can we contribute this repo !?

Issue in getting total supply of homes

Denying load of chrome-extension://iadokddofjgcgjpjlfhngclhpmaelnli/src/assets/styles.css. Resources must be listed in the web_accessible_resources manifest key in order to be loaded by pages outside the extension.

I'm getting this issue while getting total supply of homes from ipfs

``` error
Error loading blockchain data: Error: call revert exception [ See: https://links.ethers.org/v5-errors-CALL_EXCEPTION ] (method="totalSupply()", data="0x", errorArgs=null, errorName=null, errorSignature=null, reason=null, code=CALL_EXCEPTION, version=abi/5.7.0)
    at Logger.makeError (index.ts:269:1)
    at Logger.throwError (index.ts:281:1)
    at Interface.decodeFunctionResult (interface.ts:427:1)
    at Contract.<anonymous> (index.ts:400:1)
    at Generator.next (<anonymous>)
    at fulfilled (index.ts:1:1)

App.js:61 Error loading blockchain data: Error: call revert exception [ See: https://links.ethers.org/v5-errors-CALL_EXCEPTION ] (method="totalSupply()", data="0x", errorArgs=null, errorName=null, errorSignature=null, reason=null, code=CALL_EXCEPTION, version=abi/5.7.0)
    at Logger.makeError (index.ts:269:1)
    at Logger.throwError (index.ts:281:1)
    at Interface.decodeFunctionResult (interface.ts:427:1)
    at Contract.<anonymous> (index.ts:400:1)
    at Generator.next (<anonymous>)
    at fulfilled (index.ts:1:1)

Here's my javascript code the app.js

import { useEffect, useState } from 'react';
import { ethers } from 'ethers';

// Components
import Navigation from './components/Navigation';
import Search from './components/Search';
import Home from './components/Home';

// ABIs
import RealEstate from './abis/RealEstate.json'
import Escrow from './abis/Escrow.json'

// Config
import config from './config.json';

function App() {
  const [provider, setProvider] = useState(null)
  const [escrow, setEscrow] = useState(null)

  const [account, setAccount] = useState(null)

  const [homes, setHomes] = useState([])
  const [home, setHome] = useState({})
  const [toggle, setToggle] = useState(false);

  const loadBlockchainData = async () => {
    try {
    const provider = new ethers.providers.Web3Provider(window.ethereum);
    setProvider(provider);
    
      const network = await provider.getNetwork();
      const chainId = network.chainId;
    
      const contractAddresses = config[chainId];
      if (!contractAddresses) {
        throw new Error(`No contract addresses found for chainId ${chainId}`);
      }
    
      const realEstate = new ethers.Contract(contractAddresses.realEstate.address, RealEstate, provider);
      const totalSupply = await realEstate.totalSupply();
      const homes = [];
    
      for (var i = 1; i <= totalSupply; i++) {
        const uri = await realEstate.tokenURI(i);
        const response = await fetch(uri);
        const metadata = await response.json();
        homes.push(metadata);
      }
    
      setHomes(homes)
    
      const escrow = new ethers.Contract(contractAddresses.escrow.address, Escrow, provider);
      setEscrow(escrow);
    
      window.ethereum.on('accountsChanged', async () => {
        const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' });
        const account = ethers.utils.getAddress(accounts[0])
        setAccount(account);
      });
    } catch (error) {
      console.error("Error loading blockchain data:", error);
    }
    };

  useEffect(() => {
    loadBlockchainData()
  }, [])

  const togglePop = (home) => {
    setHome(home)
    toggle ? setToggle(false) : setToggle(true);
  }

  return (
    <div>
      <Navigation account={account} setAccount={setAccount} />
      <Search />

      <div className='cards__section'>

        <h3>Homes For You</h3>

        <hr />

        <div className='cards'>
          {homes.map((home, index) => (
            <div className='card' key={index} onClick={() => togglePop(home)}>
              <div className='card__image'>
                <img src={home.image} alt="Home" />
              </div>
              <div className='card__info'>
                <h4>{home.attributes[0].value} ETH</h4>
                <p>
                  <strong>{home.attributes[2].value}</strong> bds |
                  <strong>{home.attributes[3].value}</strong> ba |
                  <strong>{home.attributes[4].value}</strong> sqft
                </p>
                <p>{home.address}</p>
              </div>
            </div>
          ))}
        </div>

      </div>

      {toggle && (
        <Home home={home} provider={provider} account={account} escrow={escrow} togglePop={togglePop} />
      )}

    </div>
  );
}

export default App;

Metamask Error

Hi, am getting error anytime i want to confirm my transaction

Can anyone share the IPFS link toh the metadata

the title says it all

sendTransaction function not defined

While running the npx hardhat test command after adding the 'Sale' section in the test module, I am getting an error and I think because there is a sendTransation function missing in the escrow.sol code while we are trying to call that function. I checked the final code and it is absent there as well. I am following through the video tutorial and it is working fine in the trutorial.

What am I doing wrong ?

Error while parsing metadata of the Property

Cards are not showing because of the error
In app.js while getting metadata of the listed property, response.json() gives error.

Error connecting to Blockchain in order to list properties/load NFT contracts into App

I am facing this error when trying to list properties/load contracts into App:

/ipfs/QmQVcpsjrA6crliJjZAodYwmPekYgbnXGo4DFubJiLc2EB/${i + 1}.json: invalid path "/ipfs/QmQVcpsjrA6crliJjZAodYwmPekYgbnXGo4DFubJiLc2EB/${i + 1}.json": invalid CID: input isn't valid multihash

is the issue with this link: "https://ipfs.io/ipfs/QmQVcpsjrA6cr1iJjZAodYwmPekYgbnXGo4DFubJiLc2EB/${i + 1}.json" or there is another issue perhaps?

Additional Info:
I started facing the issue at this part of the tutorial https://youtu.be/C4blK6X-D_4?t=6715:

someone please explain what gregory said at 1:44:58 to 1:45:12, why passing accounts around like that?

what he said word-by-word:
"let's do the exactly same thing, say accounts, await, window, ethereum request get accounts and we're gonna set the accounts to the first account on the list, and then that's gonna set it the in component state of the parent component and we're gonna pass it back in here with this account like this

related code snippets:
App.js

...
function App() {
  const [account, setAccount] = useState(null)

  const loadBLockchainData = async () => {
    const provider = new ethers.providers.Web3Provider(window.ethereum)
     
  }

  useEffect(() => {
    loadBLockchainData()
  })

  return (
    <div>

    <Navigation account={account} setAccount={setAccount}/>

      <div className='cards__section'>

        <h3>Welcome to Millow</h3>

      </div>

    </div>
  );
}
...

Navigation.js

...
const Navigation = ({ account, setAccount }) => {
    const connectHandler = async () =>{
        const accounts = await window.ethereum.request({method: 'eth_requestAccounts'});
        setAccount(accounts[0])        
    }
...

video: https://youtu.be/C4blK6X-D_4?t=6298

npm install not downloading all dependencies.

Hey having some trouble downloading all dependencies. asking me to rename all the directories..

Error in order to list properties/load NFT contracts into App

Im facing this problem !!
.

Properties Not Listed
.

Getting error : Uncaught TypeError: Cannot read properties of undefined (reading 'realEstate') at loadBlockchainData (App.js:31:1)

Full Error: p.js:31 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'realEstate')
at loadBlockchainData (App.js:31:1)
l

IDK why am I getting this error even though my syntax in right and I am doing exactly as shown in the video. Even after copying the code the error still doesn't resolve. Its fetching the data for the escrow one but not for the realEstate one.
Please help!

issue when do : npx hardhat run ./scripts/deploy.js --network localhost

i got this , give me a suggestion , or a solution
PS C:\Users\User\millow> npx hardhat run ./scripts/deploy.js --network localhost
HardhatError: HH108: Cannot connect to the network localhost.
Please make sure your node is running, and check your internet connection and networks config
at HttpProvider._fetchJsonRpcResponse (C:\Users\User\millow\node_modules\hardhat\src\internal\core\providers\http.ts:223:15)
at processTicksAndRejections (node:internal/process/task_queues:95:5)
at HttpProvider.request (C:\Users\User\millow\node_modules\hardhat\src\internal\core\providers\http.ts:87:29)
at EthersProviderWrapper.send (C:\Users\User\millow\node_modules@nomiclabs\hardhat-ethers\src\internal\ethers-provider-wrapper.ts:13:20)
at getSigners (C:\Users\User\millow\node_modules@nomiclabs\hardhat-ethers\src\internal\helpers.ts:45:20)
at main (C:\Users\User\millow\scripts\deploy.js:15:46)

Caused by: Error: connect ECONNREFUSED 127.0.0.1:8545
    at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1606:16)