Tahsin Gökalp Şaan
Tahsin Gökalp Şaan Blog

Tahsin Gökalp Şaan Blog

Bilgisayarınızda NFT Nasıl Oluşturulur?

Bilgisayarınızda NFT Nasıl Oluşturulur?

Tahsin Gökalp Şaan

Published on Nov 22, 2021

4 min read

Subscribe to my newsletter and never miss my upcoming articles

Listen to this article

Buildspace 'Mint your own NFT collection and ship a Web3 app to show them off' kursunu tamamlarken aldığım notlarla oluşturulmuş bir yazıdır. İsterseniz buildspace.so adresinden siteye giriş yaparak ücretsiz olarak kursları tamamlayabilirsiniz.

Lokal Geliştirme Ortamının Kurulması

Öncelikle Hardhat aracına ihtiyacımız olacak. Eğer bilgisayarınızda kurulu değilse gerekli olan programları kurmak için buraya tıklayabilirsiniz.

Yeni bir klasör oluşturup içinde aşağıdaki komutları çalıştıralım.

npm init -y
npm install --save-dev hardhat
npx hardhat

En son komutunu çalıştırdığımızda bir seçim yapmamız istenecektir. Buradan 'Create a basic sample project' seçeneğini seçebilirsiniz. Geri kalan seçenekleri değiştirmeden devam edebiliriz.

npm install --save-dev @nomiclabs/hardhat-waffle ethereum-waffle chai @nomiclabs/hardhat-ethers ethers
npm install @openzeppelin/contracts

Komutlarını çalıştırıp gerekli kütüphaneleri kuralım. Bunlarla beraber geliştirme ortamımız tamamlanmış oluyor.

npx hardhat run scripts/sample-script.js

Komutu ile kurulumu test edebilirsiniz.

Örnek Contractın Yazılması ve Test Edilmesi

Öncelikle test/sample-test.js, scripts/sample-script.js, 'contracts/Greeter.sol' dosyalarını projemizden silelim. Ardından contracts klasörü altında istediğimiz isimde uzantısı sol ile biten bir dosya oluşturalım. Ben AllPixelNFT.sol oluşturdum. Dosyanın içerisini aşağıdaki kodlarla dolduralım.

// SPDX-License-Identifier: UNLICENSED

//Solidity versiyonu
pragma solidity ^0.8.0;

//Hardhat console kütüphanesi
import "hardhat/console.sol";

contract AllPixelNFT {
    constructor() {
        //Contact çalıştırıldığında konsole bu metni yazacak.
        console.log("Buralar hep dutluktu.");
    }
}

Contractı localde çalıştırmak için scripts klasörünün içine run.js isimli bir dosya oluşturalım. Aşağıdaki kodları dosyanın içeriğine yazalım.

const main = async () => {
 //Contractı derleyen kod
  const nftContractFactory = await hre.ethers.getContractFactory('AllPixelNFT');
  const nftContract = await nftContractFactory.deploy();
  // Deploy tamamlandıktan sonra contract adresini ekrana yazıyoruz
  await nftContract.deployed();
  console.log("Contract Adresi", nftContract.address);
};

const runMain = async () => {
  try {
    await main();
    process.exit(0);
  } catch (error) {
    console.log(error);
    process.exit(1);
  }
};

runMain();

Konsol penceresine yazacağınız npx hardhat run scripts/run.js komutuyla contractınızı çalıştırabilirsiniz. Aşağıdaki gibi bir ekranla karşılaşmanız gerekiyor.

image.png

Testnette NFT oluşturulması

Öncelikle contract dosyamızın içeriğini aşağıdaki gibi güncelleyelim.

pragma solidity ^0.8.0;

// OpenZeppelin Contractlarını ekliyoruz
import "@openzeppelin/contracts/token/ERC721/extensions/ERC721URIStorage.sol";
import "@openzeppelin/contracts/utils/Counters.sol";
import "hardhat/console.sol";

// Eklediğimiz contractlardan miras alıyoruz
contract AllPixelNFT is ERC721URIStorage {
  // tokenIdlerini tutmak için miras aldığımız contracları kullanıyoruz
  using Counters for Counters.Counter;
  Counters.Counter private _tokenIds;

  // NFT adı ve sembolünü yazıyoruz
  constructor() ERC721 ("FirstPixelNFT", "FP") {
    console.log("NFT contactim.");
  }

  // Kullanıcıların NFT almak için kullanacakları fonksiyon
  function makeAnAllPixelNFT() public {
     // 0'dan başlayan tokenIdsini alalım
    uint256 newItemId = _tokenIds.current();

     // NFTyi kullanıcıya(msg.sender) gönderelim
    _safeMint(msg.sender, newItemId);

    // NFT'nin verisini ekleyelim
    _setTokenURI(newItemId, "JSON_URL");

    // tokenIdlerini arttıralım
    _tokenIds.increment();
  }
}

jsonkeeper.com sitesine aşağıdakine benzer bir JSON yapıştırıp oluşan urli JSON_URL alanına yazmanız gerekiyor.

{
    "name": "Dutluk",
    "description": "Buralar hep dutluktu.",
    "image": "https://i.imgur.com/3lGIgPc.jpeg"
}

run.js dosyamızın içeriğinide aşağıdaki gibi güncelleyelim.

 const main = async () => {
  //Contractı derleyen kod
  const nftContractFactory = await hre.ethers.getContractFactory('AllPixelNFT');
  const nftContract = await nftContractFactory.deploy();
  // Deploy tamamlandıktan sonra contract adresini ekrana yazıyoruz
  await nftContract.deployed();
  console.log("Contract Adresi", nftContract.address);

  // NFT oluşturan fonksiyonu çağıralım
  let txn = await nftContract.makeAnAllPixelNFT()
  // Kazılmasını(Mining) bekleyelim
  await txn.wait()

  // İkinci NFT'yi oluşturalım
  txn = await nftContract.makeAnAllPixelNFT()
  // Kazılmasını(Mining) bekleyelim
  await txn.wait()

};

const runMain = async () => {
  try {
    await main();
    process.exit(0);
  } catch (error) {
    console.log(error);
    process.exit(1);
  }
};

runMain();

npx hardhat run scripts/run.js komutu ile test edelim. Herhangi bir hata vermeden şu şekilde bir ekran gözükmesi gerekiyor.

image.png

NFT'nin testnete deploy edilmesi

Testnete deploy edilmesi için Alchemy kullanıyoruz. Üyeliğimizi tamamladıktan sonra API keyi edinmemiz gerekiyor. Giriş yaptıktan sonra gelen sayfada bulunan 'Create App' butonuna tıklayalım.

image.png

Aşağıdaki bilgilere benzer bir şekilde doldurduktan sonra 'Create APP' butonuna tıklayın.

image.png

Açılan sayfada az önce yazdığımız isimdeki uygulamaya tıklayalım.

image.png

View Key butonuna tıklayıp HTTP alanında bulunan keyi not alalım.

image.png

Testnette ETH sahibi olabilmek için aşağıdaki siteleri kullanabilirsiniz.

scripts klasörünün altında deploy.js dosyasyı oluşturalım. İçeriğini aşağıdaki gibi dolduralım.

const main = async () => {
     //Contractı derleyen kod
    const nftContractFactory = await hre.ethers.getContractFactory('AllPixelNFT');
    const nftContract = await nftContractFactory.deploy();
     // Deploy tamamlandıktan sonra contract adresini ekrana yazıyoruz
    await nftContract.deployed();
    console.log("Contract Adresi", nftContract.address);

    // NFT oluşturan fonksiyonu çağıralım
    let txn = await nftContract.makeAnAllPixelNFT()
    // Kazılmasını(Mining) bekleyelim
    await txn.wait()
    console.log("Minted NFT #1")

    // İkinci NFT'yi oluşturalım
    txn = await nftContract.makeAnAllPixelNFT()
    // Kazılmasını(Mining) bekleyelim
    await txn.wait()
    console.log("Minted NFT #2")
  };

  const runMain = async () => {
    try {
      await main();
      process.exit(0);
    } catch (error) {
      console.log(error);
      process.exit(1);
    }
  };

  runMain();

Ana dizinde bulunan hardhat.config.js dosyasını şu şekilde düzenleyelim.

require('@nomiclabs/hardhat-waffle');

module.exports = {
  solidity: '0.8.0',
  networks: {
    rinkeby: {
      url: 'ALCHEMY_API_URL',
      accounts: ['PRIVATE_KEY'],
    },
  },
};

ALCHEMY_API_URL alanına HTTP alanında aldığımız metni yapıştıralım. PRIVATE_KEY alanına metamasktan alacağımız testnet private keyimizi yapıştıralım. Buradan nasıl alınacağını öğrenebilirsiniz. hardhat.config.js dosyasını asla Git'e commitlemeyin veya kimseye vermeyin.

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

komutuyla contractımızı deploy edelim. Aşağıdakine benzer bir görüntü oluşması gerekiyor.

image.png

Contract adresimizi not alalım. Benim adresim 0x471e7Eb5DEEBA4f8509717507De799dAC0480Ecb

Bu adresi rinkeby.etherscan.io sitesinde aratalım. Çıkan sayfada contractımızı görebiliriz.

rinkeby.etherscan.io/address/0x471e7Eb5DEEB..

NFT'nin OpenSea'de gösterilmesi

testnets.opensea.io veya rinkeby.rarible.com adreslerinde contract adresimizi aratalım. Şu şekilde görebiliyor olmamız lazım.

image.png

Örnek url:

rinkeby.rarible.com/token/0x471e7eb5deeba4f..

 
Share this