In deze zelfstudie zullen wij een volledig functionele app bouwen voor het minen van NFTs en het creëren van een EPIC NFT-collectie. We zullen beginnen met het begrijpen van wat NFT’s eigenlijk zijn, en vervolgens de volledig gedecentraliseerde applicatie bouwen, zodat iedereen deze kan gebruiken.
Wat zijn NFT’s?
Een NFT of Niet-fungibel token is een digitaal bezit dat linkt naar bepaalde “gegevens” (bijvoorbeeld digitale kunst, afbeeldingen enz.). De belangrijkste eigenschap van een NFT is dat het elke keer een unieke identificatiecode heeft, waardoor de eigenaar kan bewijzen dat het bezit uniek is. Een voorbeeld van een populaire verzameling NFT’s met een gemeenschappelijk thema is de Bored Ape Yacht Club.
Wat wij gaan bouwen
Wij zullen nu een gedecentraliseerde NFT-verzamelingsapp bouwen met de naam EPIC NFT’s. Gebruikers kunnen NFT’s voor de verzameling opslaan en later opvragen met behulp van hun portemonnee-adressen.
Benodigdheden
Wij hebben een beginnend tot gemiddeld kennisniveau van React nodig, evenals bekendheid met de programmeertaal Solidity. Ook hebben we een conceptueel begrip nodig van blockchain, NFT’s, crypto-portefeuilles en Etherscan. Om de app helemaal opnieuw te bouwen, zullen we gebruikmaken van gratis tools die gemakkelijk in uw systeem kunnen worden geïntegreerd. Dit zijn onder meer Visual Studio Code of een andere teksteditor, MetaMask als crypto-portemonnee, OpenSea voor NFT-hosting en Vercel en Alchemy als hostingplatforms.
Laten we beginnen
Nu we een idee hebben van wat we gaan bouwen, kunnen we beginnen met het schrijven van code. Als eerste gaan we een slim contract voor onze NFT-verzameling schrijven. Vervolgens zullen we dit contract op een openbare blockchain plaatsen, zodat iedereen NFT’s kan opslaan via dit contract. Later zullen we een klantwebsite bouwen om ook NFT’s te kunnen ‘minen’.
Het schrijven van ons slimme contract
Stap 1: Het instellen van de tools
Wij zullen Hardhat gebruiken om ons slimme contract lokaal uit te voeren. Daarvoor hebben we knoop/npm nodig in ons systeem, dus laten we deze installeren. Vervolgens moeten we de omgeving instellen vanuit de terminal met behulp van de volgende opdrachten:
mkdir nft-collection cd nft-collection npm init -y npm install –save-dev hardhat
Nu de omgeving is ingesteld, gaan we het project uitvoeren. Voer de volgende code in en kies de optie om een basisvoorbeeldproject te maken:
npx hardhat
Als deze afhankelijkheden niet standaard zijn geïnstalleerd, installeer ze dan door de volgende code uit te voeren:
npm install –save-dev @nomiclabs/hardhat-waffle ethereum-waffle chai @nomiclabs/hardhat-ethers ethers
Wij maken ook gebruik van Zeppelin open om ons slimme contract te schrijven. Installeer het pakket door de volgende code uit te voeren:
npm install @openzeppelin/contracts
Voer ten slotte de onderstaande code uit om het voorbeeldscript uit te voeren:
npx hardhat run scripts/sample-script.js
Stap 2: Schrijf een contract voor het maken van NFT’s
Laten we nu een contract schrijven dat NFT’s kan slaan. Maak een EpicNft.sol-bestand in de map ‘contracts’ en voer onderstaande code in:
pragma solidity ^0.8.1;
import “@openzeppelin/contracts/token/ERC721/extensions/ERC721URIStorage.sol”;
import “@openzeppelin/contracts/utils/Counters.sol”;
import “hardhat/console.sol”;
contract EpicNFT is ERC721URIStorage {
using Counters for Counters.Counter;
Counters.Counter private _tokenIds;
constructor() ERC721 (“SquareNFT”, “SQUARE”) {
console.log(“Dit is mijn NFT-contract. Woah!”);
}
function makeAnNFT() public {
uint256 newItemId = _tokenIds.current();
_safeMint(msg.sender, newItemId);
_setTokenURI(newItemId, “blah”);
_tokenIds.increment();
}
}
Laten we nu de makeAnNFT-functie doornemen:
uint256 newItemId = _tokenIds.current(); Dit is een unieke identificatiecode voor onze NFT, waardoor het bezit uniek blijft.
_safeMint(msg.sender, newItemId); Hier slaan we het NFT op met de ID newItemId aan de gebruiker met het adres msg.sender.
_setTokenURI(newItemId, “blah”); Hiermee creëren we de unieke identifier voor de NFT en worden de gegevens aan deze ID gekoppeld.
_tokenIds.increment(); Nadat het NFT is gemaakt, verhogen we tokenIds met een functie die OpenZeppelin ons geeft. Hierdoor krijgt elk nieuw NFT een andere ID.
Stap 3: Voeg gegevens toe voor de NFT
De JSON-bestanden met gegevens voor onze NFT’s worden opgeslagen in de ’tokenURI’. Wij moeten dus een JSON-bestand maken en deze updaten naar de tokenURI. Zorg dat de JSON-structuur overeenkomt met de OpenSea-vereisten om ervoor te zorgen dat het resultaat een correcte NFT oplevert.
Laten we nu een nieuwe regel toevoegen om in de terminal te laten zien wanneer de NFT is gemaakt:
console.log(“Aan %s is een NFT toegewezen met ID %s”, msg.sender, newItemId);
Stap 4: De NFT lokaal opslaan
Maak een ‘run.js’-bestand aan om de makeAnNFT()-functie te bellen, en voeg de volgende code toe:
const main = async() => {