Complete NFT project | landing page | Collection Template

Documentation version 1.1


Introduction

  • Item Name : Complete NFT project | landing page | Collection Template
  • Item Version : v 1.0
  • Author : Nzoni Apps

NFT project is a ready to use application developed with Angular, solidity and hardhat. The smart contract is already developed, you just have to customize it and deploy it.

This app runs fast and smoothly. Make the app beautiful in design and user experience. Clean code, best practice code and good design is the main priority.

Requirements

You will need the following tools and skills to customize this project.

  1. Nodejs installed
  2. Angular basic knowledge
  3. Blockchain and NFT basic knowledge
  4. Code Editing Software (Vs Code, Sublime Text or Notepad)
  5. FTP Tool to upload files to Server

Project Structure

Unzip the file.

You see the following folders:

Setup project


That is very easy.

1. Open Project Folder

2. Install dependencies

Make sure you have Nodejs and Angular cli installed

Run

npm install
or
npm install --legacy-peer-deps

3. Get CID address

Upload images folder and json files on nft storage like pinata and get the cid address

4. Get access to ethereum blockchain

In our case, we use infura. You can sign up here et get started for free After login, click on ethereum

Click on add new project

Enter the project name

The endpoints must be mainnet for the project. Copy the url

Export your metamask private key

Connect to your metamask and click on three points

Choose account details

Choose export private key

Enter your password and copy the private key

Now you have an url copy from infura and the private key from metamask

5. Edit hardhat Config

edit hardhat.config.js file

Change the url value by the url from infura and add the private after '0x' as accounts value

6. Edit smart contract

  • Rename the smart contract
  • contracts/mycontractname.sol file name and its content
  • define the cost
  • define the maxSupply that is the images number
  • define the maxMintMount that is the max number of your nft
  • Rename contract name in scripts/deploy.js
  • any mycontractname to your contract name (Care about first uppercase in same case)

7. Edit scripts/deploy.js file

Edit any contract name and add your json url from pinata

8. Deploy smart contract get address

Run

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

Copy the deployed address

9. Edit src/environment/environment.ts file

website_name, nft_name, contract_deployed_address, discord_link, facebook_link, instagram_link, facebook_link

You can change any others text in src/app/components according to your desire

10. Build project

ng build
or
npm run build

copy dist/ folder content on your server

Now your nft project is launched


Support

If you have any question or any problem regarding this app, feel free to Contact Us via support@nzoni.app