본문 바로가기
etc/블록체인 뉴딜일자리사업

NFT 발행 실습

by vellahw 2023. 6. 9.

 

💭 서론

교육 24일차

오늘은 NFT 프로젝트에서 백엔드 개발자로 근무하고 계시는 분께서 강의를 오셔서 NFT 발행 실습을 해보았다. 말이 잘 안 들리고 빨라서 따라가기 버거웠.. ㅎ ㅠ 아쉬웠던게 이건 이래서 하는 작업이다~ 이건 이러한 역할을 한다~ 같은 설명이 없어 그냥 따라하는 수 밖에 없던 것.. 코드 생김새가 대충 역할이 짐작가는 것들이긴 했지만 ㅜㅜ 그래도 어떤식으로 발행되는지 찍먹 할 수 있는 시간이었다.

 

 

 

✔️ 일반적인 NFT 민팅 절차

  1. 프로젝트 기획 및 NFT 아트 준비
  2. 분산형 저장소에 소스 업로드
  3. 블록체인 상에 NFT 발행 준비
  4. Web3 민팅 페이지 오픈
  5. 사전 마케팅 및 커뮤니티 오픈
  6. 멤버십 체결 및 연계 해택 발표
  7. 화이트리스트, OG 이벤트 발표
  8. 아트 리빌 (reveal)

아트 준비 기간에 많은 시간과 노력이 들기때문에 아트 준비를 늦추기도 한다.

위 절차에 따른 실습을 해볼 것임!

 

 

 

✔️ 아트 생성 방식

아트는 Generative Art와 Fine Art로 구분된다.

 

Generative Art는 준비된 레이어를 랜덤하게 조합하여 생성된다. 대량의 컬렉션(1천장~1만장 단위)이며 레이어 조합 발생 비율을 조정하여 레어 파츠를 지정할 수 있어 소유욕과 경쟁심을 유발한다. 두들즈, BAYC 등의 NFT가 해당됨.

 

Fine Art는 한 장씩 그려지는 것이다. 소량의 컬렉션(1장~100장 단위)이며 작품성에 가치를 둔다.

Fine Art NFTs (출처:https://nftnewspro.com/out-of-africa-nfts-joins-physical-fine-art-masterpieces-to-the-blockchain/)

 

 

 

✔️ NFT 발행 실습

node.js와 VSCode가 필요하다. 설치되어 있으니 설명은 패스..

 

강사님 github에 접속해 코드를 다운로드

 

설치가 완료되었으면 압축 해제 후 VSCode에서 폴더를 연다.

그리고 VSCode 터미널에서 아래 명령어를 차례로 입력한다. 

npm install canvas

npm install

npm run build

 

순서대로 쌓일 레이어들

layers 폴더 안에 9가지 폴더가 있는데 이 안엔 랜덤으로 조합될 이미지 레이어 파일들이 존재한다.

 

폴더 안 파일들은 파일명이 위처럼 '특성명#등장비율'로 설정되어있다.

1부터 9까지의 폴더에서 이미지가 하나씩 랜덤으로 조합되어 9개의 이미지가 모여 최종 이미지가 생성되는데, 각 이미지가 가지고 있는 숫자들(#등장비율)을 모두 합하면 100이 된다.

랜덤 조합시 #등장비율/100의  비율대로 이미지가 등장하게 된다. 

등장비율을 조정해 레어 파츠를 지정할 수 있다.

 

config.js 파일 분석

config.js 파일을 보면 위 두 상수가 보인다.

EDITION_SIZE는 생성할 소스의 개수를 뜻하므로 이 프로젝트에선 100개의 이미지를 생성한단 뜻.

LAYERS_ORDER는 삽입한 폴더명을 쌓아올릴 레이어 순서대로 입력한 것이다.

순서가 틀어지면 이미지 정렬 순서가 무너지게 됨

 

BACKGROUND는 배경색을 생성하는 코드다.

generate를 false로 주면 배경이 투명하게 생성되어 직접 만든 배경을 적용할 수 있다.

 

 

📍 IPFS에 소스파일 업로드하기

IPFS? (InterPlanetary File System)

  • 분산형 파일 저장 프로토콜이다.
  • P2P 통신으로 여러 노드에서 조각을 수집함
  • 일부 노드에 장애가 있어도 서비스가 가능함
  • 전송 비용을 절감할 수 있다.

 

NFT Storage에 접속해 계정을 생성하고 로그인 한다. 그럼 아래와 같은 Files 페이지로 이동하게 된다.

 

API를 이용해 파일을 한 번에 업로드 할 것이다.

상단 메뉴 중 API Keys로 이동해 New Key 버튼을 눌러 key를 생성한다.

이름은 원하는대로 입력

create 버튼을 누르면 위처럼 Key가 생성된다.

생성된 키의 Actions-Copy 버튼을 눌러 키값을 복사한다.

 

복사한 키는 store.mjs 파일을 열어 API_KEY 상수에 붙여준다.

파일 저장후 터미널에 node store.mjs 명령어를 입력해 파일을 실행한다. 오류가 나지 않으면 완료된 것!

 

오류가 나지 않았다면 Files 페이지에 들어가면 위처럼 파일이 업로드된 것을 확인 할 수 있다.

이미지 파일 100개가 하나의 CID로 업로드된 것이다.

 

이제 Actions-Copy IPFS URL을 클릭해 URL을 복사해준다.

 

addr.mjs 파일의 IPFS_BASE에 복사한 IPFS URL을 붙여넣는다.

그리고 터미널에 node addr.mjs 명령어로 파일을 실행 후 오류가 나지 않으면 완료!

 

storejson.mjs 파일을 열어 아까 발급 받은 API KEY를 다시 복사하여 입력한다. 

그리고 터미널에 node storejson.mjs 명령어를 입력해 파일을 실행한다.

 

Files 페이지에 업데이트 된 것을 확인

 

 

📍 블록체인에 NFT 스마트 컨트랙트 발행하기

카이카스를 다운로드 후 시드문구까지 입력해준다.

 

우리는 실제 발행이 아닌 테스트용, 실습이기 때문에 상단의 메인넷 버튼을 눌러 baobab 테스트넷으로 전환한다.

 

▶️ 테스트용 클레이튼 발급 받기

해당 링크로 접속 후 지갑 주소를 복사하고 붙여넣은 뒤 KLAY Balance는 0으로 그대로 두고 Run Faucet을 누르면 테스트용 150 KLAY를 받을 수 있다.

150 KLAY~~

 

▶️ 스마트 컨트랙트 발행하기

* 클레이튼 리믹스로 접속한다.

contract 폴더에 새파일을 생성한다. (안에 있는 모든 sol 파일들은 모두 삭제해도 무방)

이 파일 코드를 복사 해서 붙여넣고 버전 0.5.17로 컴파일한다.

 

 

🔑 개인 지갑키 복사하기

디플로이 하려면 지갑 키가 필요하다.

 

카이카스 지갑을 열어 상단 계정 별명을 클릭한다.

 

지갑키 관리를 클릭하고 비밀번호를 입력하고 지갑키 내보내기를 클릭한다.

그러면 개인키가 등장~~ 

 

 

다시 리믹스로 이동해서 Environment는 Baobab으로 변경해준다.

account에 방금 복사한 개인키를 붙여넣는다.

CONTRACT는 KIP17NFTToken으로 변경한다.

DEPLOY에서 name과 symbol을 입력하는데 name은 토큰 이름, symbol은 코인 축약어이다.

 

 

▶️ NFT 민팅 사전 준비

다시 nft storage의 Files 페이지에서 업로드 했던 이미지 중 용량이 작은 파일의 IPFS URL을 복사한다.

 

스마트 컨트랙트의 setBaseURI와 setNotRevealedURI에 복사한 주소를 입력하는데 마지막에 슬래시(/)를 붙여준다.

 

setupSale을 위와 같이 설정한다.

  • newAntibotInterval: 연속 시도 방지 지연 시간. 봇을 통한 불공정 민팅을 방지한다.
  • newMintLimitPerBlock: 한 번의 트랜잭션에 최대로 민팅할 수 있는 개수
  • newMintLimitPerSale: 이번 민팅 기간 동안 한 지갑이 최대로 민팅할 수 있는 개수
  • newMintStartBlockNumber: 이번 민팅 기간이 시작되는 블록 높이
  • newMintIndexForSale: 이번 민팅 기간에 최초로 민팅될 NFT의 번호
  • newMaxSaleAmount: 최대 NFT 개수 제한
  • newMintPrice: 민팅 가격 (설정할 땐 클레이튼에 따랐음..)

 

setPublicMinEnabled의 값을 true로 입력하고 transact한다.

퍼블릭 민팅 설정값을 불가능에서 가능으로 변경해준 것이다.

 

 

📍 민팅 페이지 오픈하기

코드를 다운로드 하고 VSCode에서 해당 폴더를 연다.

 

config.js 파일에서 CONTRACT_ADDRESS를 리믹스에서 디플로이한 컨트랙트 주소를 복사해 붙여넣는다.

컨트랙트 주소는 여기서 복사

 

📍 민팅 페이지 배포하기

netlify에 접속한다.

Sites 메뉴에서 워크스페이스 폴더를 드래그&드랍 해준다. 그럼 사이트가 생성 됨!

Sites 페이지. 여기에 폴더를 드래그

 

오픈된 페이지!

Connect Wallet 버튼을 누르면 카이카스 지갑과 연동되고 민팅 가능 여부가 화면에 표시된다.

 

 

📍 거래소에서 프로젝트 관리하기

opensea 테스트넷에 접속해 지갑을 연결하고 서명도 해준다. (sign up)

 

프로필

상단 메뉴의 우측 프로필 버튼을 누르면 민팅에 성공한 NFT 목록을 확인할 수 있다.

 

NFT 상세 페이지에서 Refresh metadata를 눌러 부가 정보 연동을 요청할 수 있다.

 

부가정보는 이 단계에서 config.js 파일의 NAME_PREFIX, DESCRIPTION 상수임

 

 

▶️ 프로젝트 정보 및 수수료 설정하기

상단 메뉴 프로필 버튼의 My Collections에서 이름, 로고 이미지, 수수료 등을 설정할 수 있다.

 

Edit collection으로 진입

 

Earnings 탭에서 거래 수수료를 설정할 수 있으며 최대 10%까지 설정 가능하다.

 

 

 


 

댓글