Polygon Nft Marketplace

The stack

• Web application framework - Next.js
• Solidity development environment - Hardhat
• File Storage - IPFS
• Blockchain infrastructure - Infura
• Ethereum Web Client Library - Ethers.js

Setup

1. Install the dependencies

npm install
# or
yarn

2. Start the local Hardhat node

npx hardhat node

3. Deploy the contracts to the local network

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

This command create config.js for contract accessing from frontend.

4. Create ipfs_project in Infura.

[INFURA](https://infura.io/)

5. Set environment variable to Next.js

# matamask private key
NEXT_PUBLIC_PRIVATE_KEY=

# infura_ipfs settings
NEXT_PUBLIC_PROJECT_ID=
NEXT_PUBLIC_PROJECT_SECRET=
NEXT_PUBLIC_INFURA_IPFS_DEDICATED_GATEWAYS_SUBDOMAIN=

6. Modify next.config.js Enable to access external image url.

  images: {
    domains: [
      // https://docs.infura.io/infura/networks/ipfs/how-to/access-ipfs-content/dedicated-gateways
      '${YOUR_INFURA_IPFS_DEDICATED_GATEWAYS_SUBDOMAIN}.infura-ipfs.io'
    ],
  },

7. Start Next.js

npm run dev
# or
yarn dev

Contract test

npx hardhat test

This command executes script of /test

Reference

• How to Build a Full Stack NFT Marketplace on Ethereum with Polygon and Next.js - [2021 Tutorial]