There is no react packages inside this repo
#How is it looking code
Before we start what we will use source
1 - REACT
2 - HARDHAT
3 - İNFURA
4 - ETHERSCAN
5 - NODE
6 - CHAKRA UI
7 - ALCHEMY
8 - PİNATA
9 - HASHLİPS CONTRACTS
Let We Start ;)
- npx create-react-app x
- Enter to inside x file (dont paste this code to terminal)
- npm i -D dotenv
- npm i -D @nomiclabs/hardhat-etherscan
- npm i -D hardhat
- npx hardhat
- reate basic simple project
- npm i @openzeppelin/contracts
- get to chakra uı webiste and go to installation - then copy (npm i ....)
# We will delete some file in x folder example; satup-test.js,app.test.js vb
Of course you have to clear ın ındex.js into reportWebtials and course we should delete something in app.js
Find contracts folder then create new file in contracts name 'y.sol' paste your solidity code into y.sol
Enter to scripts folder and create new file name is 'deploying.js' then put your code into deploying.js
We will get fake ether like goerli testnet we can buy from https://goerlifaucet.com/
And of course should from metamask settings show testnets
Go to infura and create new project. choose goerli testnet
Come back to vscode add .env file
Enter etherscan key on .env file
Enter private keys on .env file
Enter hardhat.config.js and put your code inside to hardhat.config.js
Right now we can compile this code
npx hardhat compile
npx hardhat run scripts/deploying.js --network georli
We can go to goerliethercan and we can see contract address
But there is a little problem this contract dont verify we will verify this contract
npx hardhat verify -- network goerli -enter the contract adress here-
Very good everything is working right now ;)
Actually its very clear we can look 'mainMint.js file'
We used to web3 for connection to website or we can use ether.js its your choice
async function handleMint() {
if(window.ethereum) {
const provider = new ethers.providers.Web3Provider(window.ethereum);
const signer = provider.getSigner();
const contract = new ethers.Contract(
minessAdress,
mines.abi,
signer
);
This code allow us to connect but we see mines.abi First of all we have to add mines.abi file to src folder.
This image we can see it but the name is different to src because ı changed it
This file name is Miness.json
I just did copy past from artifact/contracts/....json. to src/Miness.json
Everything is looking good
First of all we should go to hashlips github contract -
https://github.com/HashLips/hashlips_art_engine
We can see how to use this repo
İf you create nft images and json's we can go to ıpfs website , pinata.
##Very good almost done
### This side little important for your nft upload to testnet.opensea
This photo we are seeing BaseUrl we have to add from ipfs metadata so json file to baseUrl
Of course we have to allow some function for make a mint
so how we can control this token 'NFT'
if you want you can go to ethercan and connect your wallet then you can mint here
OR
you can mint website
WELL DONE EVERYTHİNG İS DONE ;)
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent