ghiblin / nft-marketplace

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Simple NFT Marketplace

This is a small DApp project that show you how to setup a small Marketplace to create and sell NFTs. To implement it, I used:

  • Solidity: the principal language used to develop Smart Contracts
  • Open Zeppelin: a battle-tested suite to develop your Smart Contracts
  • Truffle Suite: a suite of tools for Smart Contract development
  • Ganache: a local personal Blockchain used to deploy and test your Smart Contracts
  • Infura: the Web3 backend Infrastructure-as-a-Service that allow your to interact with multiple blockchains and IPFS
  • NextJS: a ReactJS-based framework that allows your quickly develop web applications
  • and much more.

Before to begin

You will need an Infura account to uplaod NFT images and Metadata to IPFS. As the Infura IPFS public gateway was deprecated on August 10, 2022 and is no longer accessible, you need to use dedicated gateways and that requires you enter a Credit Card in your profile, but don't worry: Infura give you a 5GB free IPFS storage, quite enough to start and experiment with your project.

Disclaimer

This project is not production ready, and it uses your Project ID and your API Secret in order to upload images and metadata on IPFS through ipfs-http-client from the end user's browser (check ./src/api/ipfs.js), so that secret will be in the final bundle (if you don't trust me, try to build your project with npm run build and look for your API secret).

If you want a more secure solution, you can create an API endpoint in order to call Infura IPFS API and not reveal your secrets.

Setup the project

1. Installation

Start by cloning this repo:

  git clone https://github.com/ghiblin/nft-marketplace.git

Go to the project directory

  cd nft-marketplace

Install dependencies

  npm install

2. Environment Variables

If you don't already have one, create an Infura account follow the instruction in the official documentation and create a new IPFS project.

Setup your .env file:

INFURA_IPFS_PROJECT_ID=<your Infura IPFS Project ID>
INFURA_IPFS_API_SECRET=<your Infura IPFS API Secret>
INFURA_IPFS_SUBDOMAIN=<Your subdomani>

3. Run the project

Before to run any code, you need to compile the Smart Contracts and deploy it on your Ganache client. Using the --db flag allow you to store your ganache state locally, otherwise you need to redeploy the contract everytime.

Run your Ganache client:

  ganache --db="./data/save"

Compile and deploy the Smart Contracts:

  npm run deploy

Start your development environment:

  npm run dev

Pay attention: this command will start a Ganache instance, so you can:

  • stop your previous instance
  • start only the frontend through:
  npm run dev:next

About


Languages

Language:JavaScript 87.1%Language:Solidity 12.8%Language:CSS 0.1%