Cara Membuat Ribuan NFT dengan Node.js

 

Cara Membuat Ribuan NFT dengan Node.js - Jika Anda tersandung di blog ini dan bertanya-tanya "Apa sih NFT itu" saya akan mengarahkan Anda ke blog ini yang akan membantu Anda mempercepat NFT. Tetapi untuk penjelasan singkat, NFT adalah akronim untuk token nonfungible yang berarti token Anda unik dan keunikan itu berarti token Anda tidak bernilai sama dengan jumlah orang berikutnya.

Hal selanjutnya yang perlu dipahami adalah proses pencetakan NFT yang dapat dibaca di sini

NFT dicetak melalui kontrak pintar yang menetapkan kepemilikan dan mengelola kemampuan transfer NFT. Ketika seseorang membuat atau mencetak NFT, mereka mengeksekusi kode yang disimpan dalam kontrak pintar yang sesuai dengan standar yang berbeda, seperti ERC-721 . Informasi ini ditambahkan ke blockchain tempat NFT dikelola. Proses pencetakan, dari tingkat tinggi, memiliki langkah-langkah berikut yang dilaluinya:

·         Membuat blok baru

·         Memvalidasi informasi

·         Merekam informasi ke dalam blockchain

 

Sebelum kita mulai ada beberapa hal lain yang kita perlukan:

• sebuah IDE
• Node.js
• satu set gambar (1000 X 1000px)

Ada proses berbeda untuk menyiapkan ide Anda dan menginstal node.js, jadi saya sarankan untuk mencari sumber daya secara online berdasarkan mesin Anda.

untuk kumpulan gambar, Anda memerlukan setidaknya dua jenis gambar atau 'lapisan' berbeda yang akan ditumpuk satu sama lain sehingga semuanya memerlukan nama yang terstruktur serupa. mantan. lapisan1_1 lapisan1_2 ...

Setelah Anda memiliki semua hal yang disebutkan di atas, lanjutkan dan lanjutkan.

Kode

hal pertama yang perlu kita lakukan adalah membuat folder di komputer kita yang akan menjadi direktori untuk proyek kita.
setelah kami membuat folder ini, kami perlu menjalankan yang berikut di konsol kami DALAM ORDER INI:

npm init

npm install canvas

• npm init membuat file konfigurasi yang akan mengatur op proyek kami untuk mengimplementasikan paket node dengan mudah
• kanvas adalah apa yang akan digunakan untuk menghasilkan gambar kita.

setelah kita melakukan langkah sebelumnya, kita dapat melanjutkan dan menulis beberapa kode dan kita akan mulai dengan membuat file index.js dan mengimpor beberapa paket ke dalam dokumen kita

// index.js
const fs = require('fs')
const { createCanvas, loadImage } = require("canvas")

 

Selanjutnya kita akan membuat kanvas variabel dan mengambil konteks kanvas. yang akan menjadi area gambar kita

// index.js
const canvas = createCanvas(1000, 1000)
const ctx = canvas.getContext('2d')

 

Selanjutnya kita akan menulis fungsi yang akan menggambar sesuatu ke kanvas kita, kita akan melakukannya dengan fungsi asinkron sehingga kode berikut akan menunggu gambar diatur

// index.js
const drawLayer = async () => {
    const image = await loadImage("./baseImage.png") // <== your file in here
    ctx.drawImage(image, 0, 0, 1000, 1000)
    console.log("this ran")
}

 

Sangat penting bahwa fungsi loadimage Anda menentukan nama file ANDA yang Anda miliki untuk file dasar Anda

Langkah selanjutnya adalah membuat fungsi yang akan menyimpan gambar kita yang dibuat saat kita menjalankan fungsi Draw.

// index.js
const saveLayer = (_canvas) => {
    fs.writeFileSync("./newImage.png", _canvas.toBuffer("image/png"))
}

 

apa yang terjadi di sini adalah kita pada dasarnya menggambar apa pun yang kita miliki sebagai _canvas dan menyimpannya sebagai newImage.png
langkah selanjutnya adalah menambahkan baris kode berikut dalam fungsi draw layer Anda

// index.js
saveLayer(canvas)

 

sekarang jika Anda memanggil drawLayer() di file js indeks Anda dan menjalankan node index.js di konsol Anda, Anda akan melihat gambar baru muncul di direktori Anda. YA!!

Selanjutnya kita akan membuat folder baru di direktori kita yang disebut input yang akan menjadi semua gambar atau lapisan input yang mungkin untuk diambil dan dibuat oleh program kita.
di dalam folder itu gambar Anda harus dipisahkan berdasarkan kategori atau 'lapisan' ke dalam folder yang berbeda

di dalam folder input baru buat file bernama config.js, file inilah yang akan membuat program kita lebih dinamis.
sebelum kita sampai pada hal-hal menyenangkan, Anda ingin menambahkan yang berikut ini ke bagian atas config.js baru kami

// config.js
const fs = require('fs')

 

Hal pertama yang akan kita lakukan adalah membuat array objek yang menentukan lapisan berbeda yang akan dimiliki gambar output kita.

// config.js
const dir = `${__dirname}`
const layers = [ // <-- this is what your objects should look like
    {
    id: 1,
    name: "background", //<---------  change this
    location: `${dir}/background/`, // and this 
    elements:  getElements(`${dir}/background/`), // and 
 this accordingly
    postion: {x: 0, y: 0},
    size: {height: 1000, width: 1000}
}
]

 

hal selanjutnya yang harus dilakukan adalah membangun fungsi yang kami tentukan di atas dalam properti elemen

// config.js
const addRarity = _str => {
  let itemRarity;

  rarity.forEach((r) => {
    if (_str.includes(r.key)) {
      itemRarity = r.val;
    }
  });

  return itemRarity;
};

const cleanName = _str => {
  let name = _str.slice(0, -4);
  rarity.forEach((r) => {
    name = name.replace(r.key, "");
  });
  return name;
};

 

 

apa yang dilakukan fungsi ini adalah membaca jalur yang ditentukan sebagai parameter dan kemudian memfilter nama file yang buruk, lalu kita akan mengulangi setiap item
dan membuat objek untuk setiap folder dan menyimpannya dalam lapisan. elemen yang sesuai

selanjutnya kita akan mendefinisikan dua fungsi diatas cleanName dan getRarity.

// config.js
const rarity = [
    {key: "", val: "common"},
    {key: "_r", val: "rare"},
    {key: "_sr", val: "super rare"}
]

 

fungsi nama bersih pada dasarnya menghasilkan nama bersih tanpa.png yang dibuat di properti nama fungsi getElements fungsi
addRarity memeriksa apakah
selanjutnya kita akan membuat tingkat kelangkaan yang sedang diulang melalui fungsi cleanName
, kunci dan nilai Anda dapat menjadi apa pun yang Anda inginkan, tetapi misalnya:

// config.js
module.exports = {layers, width, height}

 

Anda dapat menambah atau mengurangi lebih banyak tingkat kelangkaan sesuka Anda

Sekarang kita akan mengekspor beberapa hal yang kita definisikan di file config.js

// index.js
const {layers, width, height} = require("./input/config.js")

 

sekarang jika Anda menambahkan console.log(layers) ke file config.js Anda, Anda akan melihat ketika Anda menjalankannya array objek dengan jumlah elemen yang benar di folder Anda

selanjutnya kami ingin dapat menentukan berapa banyak versi/edisi/NFT yang ingin kami buat dan kami akan melakukannya dengan mendefinisikan beberapa variabel sebagai angka dan menjalankan loop sebanyak itu

// index.js
const edition; <== set equal to your number of editions
for ( let i=1; i <=1; i++) {
    layers.forEach((layer) => {
        drawLayer(layer)
    })    
}

 

di dalam loop kami, kami mengulangi setiap lapisan yang kami impor dari file config.js kami dan menggambar lapisan dengan setiap lapisan

selanjutnya kita akan memperbarui fungsi drawLayer kita sebagai berikut

// index.js
    let element = _layer.elements[Math.floor(Math.random() * _layer.elements.length)] // insert as first line of function

 

selanjutnya kita akan memodifikasi gambar const dan cxt.drawimage menjadi lebih dinamis karena kita akan membuat lebih dari satu gambar

// index.js
    const image = await loadImage(`${_layer.location}${element.fileName}`)
    ctx.drawImage(image, _layer.position.x, _layer.position.y, width, height)

 

sekarang kita akan menambahkan edisi gambar dengan meneruskannya ke fungsi saveLayer yang kita panggil di fungsi drawLayer kita

// index.js
saveLayer(canvas, _edition)

 

sekarang kita mengatur fungsi saveLayer untuk menerima argumen baru dengan memberikan parameter di mana kita mendeklarasikan fungsi saveLayer dan membuat fungsi lebih dinamis untuk menangani parameter apa pun yang masuk.

// index.js
const saveLayer = (_canvas, _edition) => {
    fs.writeFileSync(`./output/${_edition}.png`, _canvas.toBuffer("image/png"))
}

 

sumber daya:

• YouTube.com/HashLips

 

<

Share :