Torch for new way

지난 글에 이어서 지금까진 민팅된 토큰이 종류별로, 랭크 별로 몇개가 있는지를 보여주는 기능, 토큰 리스팅 기능을 구현해보자. 우리가 ch2에서 컨트랙트를 수정할 때, 이중 배열을 이용해 랭크, 타입 별로 갯수를 저장해두고, 이 값을 가져올 수 있는 함수를 만들어두었다. 지금까지 해왔던 것과 크게 다르지 않다. 원하는 데이터를 담을 변수(data), 그 데이터를 바꿔줄 함수(setData), useState를 선언하고, 컨트랙트와 상호작용해 데이터를 가져올 함수(getData)를 만든 후, 그 함수에서 setData함수를 호출한다. getData함수는 적절한 때에 실행하고 그 결과값을 랜더링에 포함시키면 된다. 1. token 통계 보기 /* front/pages/index.tsx */ // ...중략 ..

저번에 했던 것에 이어서 이번에는 디앱과 컨트랙트에 사용자 편의적인 기능을 좀 추가하고, 토큰 판매 기능을 구현해보려고 한다. 이를 위해 우선 컨트랙트를 좀 수정하고 (약간의 함수와 변수의 추가), 이를 사용할 ui를 만들어주면 되겠다. 1. 컨트랙트 수정 abcToken에는 우선 metadataURI를 바꿀 수 있는 (컨트랙트 배포자만 사용가능한) 함수를 넣고, 사용자가 원하는 경우 특정 토큰의 rank나 type을 볼 수 있게 해주는 함수를 추가할 것이다. 또, 지금까지 민팅된 토큰 통계를 볼 수 있는 함수도 만들어보자. (어떤 type은 지금까지 몇 개 배포되었는지와 같은 정보들) /* truffle/contracts/abcToken.sol. */ // ...중략 contract abcToken i..

마지막으로 지난 글에서 우리가 만든 두 개의 컨트랙트를 기반으로 사용자가 본인의 지갑으로 민팅을 진행할 수 있는 dApp을 만들어보자. ts와 react, nextjs를 사용할 것이고, chakra-ui를 사용해 디자인을 입혀줄 것이다. chakra-ui는 ant design처럼 미리 디자인을 만들어둔 것을 우리가 가져다 사용하도록 해주는 툴이라고 보면 된다. 솔리디티나 블록체인에 대한 내용보다는 우리가 만든 것들을 어떻게 사용자가 프론트에서 보고 사용할 수 있는지를 알아보는데 초점을 두고 진행한다. 1. set up 우선 루트 디렉토리에 폴더가 두 개 필요할 것이다. 하나는 컨트랙트들이 들어갈 트러플 폴더, 하나는 리액트 관련된 데이터들을 넣을 front 폴더이다. truffle 폴더에서 truffle..

지금까지 공부해온 ERC-721 관련 컨트랙트들에 관한 지식을 기반으로 실제로 nft 토큰을 만들고 배포해보자. ch2까지가 이론편이었다면 이번 편부터는 실전편이라고 생각하면 되겠다. 우선 발행자 입장에서 랜덤으로 nft를 민팅할 수 있는 기능을 만들고, 사용자 입장에선 그 기능을 사용해 실제로 nft 민팅을 하고, 민팅한 nft를 다른 사람에게 줄 수 있도록 해볼 것이다. 오늘은 erc721 관련 컨트랙트들의 함수들을 직접 작성하는 일은 거의 없고 오픈 제펠린에서 제공하는 컨트랙트와 함수들을 활용할 것이다. 우선 truffle 셋업, open-zeppelin 설치 (contract 폴더 안에) 과정을 실행한 후, abcToken.sol 파일을 contract 폴더에 만들어주자. truffle init ..

지난 글에서는 erc-721 토큰의 가장 기본적인 기능을 구현해보았는데, 오늘은 여기에 더해 openzeppelin에서 제공하는 erc721 관련 컨트랙트들을 사용해 사용자들간의 nft 소유권 이전, 위임 등에 대한 기능들을 구현해보자. truffle을 셋업하고 npm으로 openzeppelin-solidity를 설치한다. 그리고 contract 폴더 안에 ERC721 폴더를 만들고 ERC721.sol, IERC721Metadata.sol, IERC721.sol 파일을 총 3개 생성해준다. 이 파일들에 interface, contract들을 작성한 후, 서로 상속하고 받음으로써 컨트랙트를 완성해나갈 것이다. 실제로 nft를 발행할때 이런 식으로 일일히 함수를 작성하진 않지만 여기서는 각 코드들, 함수들이..

ERC721 토큰은 우리가 nft, non-fungible token이라고 부르는 것들이다. ERC-20이 우리가 실생활에 사용하는 현금처럼 천원 짜리는 다 똑같은 천원짜리로 생각한다면 nft는 토큰인데, 각 토큰이 전부 구별 가능한 특성을 지닌 토큰이다. 그렇기 때문에 ERC-20 토큰을 2개 줄땐 그냥 줄 토큰의 갯수를 입력하면 되지만, ERC-721 토큰을 줄 때는 내가 가진 어떤 토큰을 줄 것인지를 명확하게 특정지어 주어야 한다. 이번에는 직접 nft를 민팅해보고 내 nft의 소유권을 다른 사람에게 이전해보는 과정을 공부해보도록 하자. erc-721 토큰도 ERC-20처럼 이미 그에 맞는 기능들이 전부 openzeppelin에 구현되어 있지만 이를 그냥 사용하기 보다 이 함수들이 어떤 식으로 작동..

지난 번 글에 이어 계속해 cryptozombie를 해보면서 solidity 문법을 공부해보자. Ch1의 내용들이 주로 나 혼자만을 생각하고 작성했다면 Ch2부터는 컨트랙트가 배포되었을 때 다른 사람들은 이 컨트랙트에 어떤 식으로 접근할 것인지에 대해 비중을 약간씩 늘려볼 것이다. // SPDX-License-Identifier: MIT pragma solidity >=0.5.0 uint) public accountBalance; // address가 key, uint가 value의 데이터 타입, mapping의 이름은 accountbalance가 된다. 이걸 가지고 우리가 만들던 컨트랙트에서 생성된 구조체 Zombie의 id (zombies 배열의 index값)와 그 구조체(Zombie)를 만든 사람이..

ERC-20은 이더리움 네트워크 내에서 사용될 토큰의 규격이라고 배운 적이 있는데, 바꿔 말하면 이는 이더리움 제작자 측에서는 이 규격에 맞춰 토큰을 만들고 발행하는 것을 어느 정도는 권장한다는 것을 의미한다. 그래서 이더리움 재단에서 만든 토큰을 쉽게 만들어낼 수 있는 툴이 존재한다. openzeppelin-solidity 라는 라이브러리가 존재하는데, npm으로 설치해주면 된다. npm i openzeppelin-solidity 이를 설치하고 node_modules/openzeppelin-solidity/contracts/token/erc20/erc20.sol 의 솔리디티 파일을 열어보면 안에 rec20 규격에 맞춘 토큰에 대한 컨트랙트가 존재한다. 이를 그대로 상속해서 써도 좋고, 필요하다면 약간의..

오늘은 컨트랙트를 통해 이더리움을 지불하고 무언가 ( 토큰 등)를 사고, 혹은 그것을 다시 환불하는 기능을 구현해보도록 하자. solidity의 고유한 특성 중 하나로 payable 속성이 있다. 이름을 보면 알 수 있듯 돈 (보통 이더리움)을 지불하는 기능과 연관된 속성이다. 사용자가 버튼을 누른다던가 해서 구매를 하면 컨트랙트가 발동을해 사용자에게서 이더리움을 받고, 물건을 준다. 반대로 환불을 할때도 컨트랙트가 해당 account의 물건을 제거하고 돈을 돌려주면 된다. 이 떄 컨트랙트가 이더리움을 주고 받을 수 있는 상태여야하는데, 이런 것들을 허용해주는 것이 payable 속성이라고 보면 된다. 이 속성이 있다면 tx object를 만들 때 tx { from : account, to : ca, d..

코인과 토큰을 혼용해서 쓰는 경우가 많고, 실제로 거래소 등에서 이들을 사고 팔고 할때는 이 둘의 차이가 그다지 중요하지 않다. 하지만 프로그래밍의 관점에서 볼 때 이 둘에게는 큰 차이점이 하나 존재하는데. 코인은 자신의 메인 네트워크를 가지고 있고, 토큰은 자신들의 네트워크 없이 다른 메인 네트워크를 이용해 이동하는 것들이다. 이더리움의 경우 이더리움의 메인네트워크가 있으며, 이는 일정한 규격을 지키는데, (여기서 규격이란 객체가 typescript를 이용해 class 객체를 선언하는 것 처럼 어떠 어떠한 속성값을 가져야 한다는 것을 의미한다.) 이 이더리움 네트워크를 사용하는 다른 토큰들도 이 규격을 어느 정도 따라가게 된다. 이더리움의 규격은 ERC-20이라고 부른다. 오늘은 이런식으로 스마트 컨트..

이 카테고리는 기본적인 솔리디티 문법과 사용법을 알려주는 cryptozombie를 직접 해보고 이를 내가 이해한대로 정리해보기 위해 만들었다. 처음 컨트랙트와 솔리디티 버전을 적는 등의 기본적인 작업부터 차근차근 해보자. 그 쪽에서 제시해준 솔리디티 코드의 기초적인 활용을 내 방식대로 적당히 패러프레이징 하면서 익혀가는 것을 목적으로 한다. 1. set up 1. 솔리디티 파일을 작성할때 가장 먼저 작성해줄 것은 가장 첫 줄에 주석을 달고 spdx~ 하는 것과 현재 솔리디티의 버전이다. 2. 그리고 컨트랙트를 선언해준다. 컨트랙트 이름은 ZombieFactory이다. // SPDX-License-Identifier: MIT pragma solidity >=0.5.0 < 0.6.0; contract Zom..

지난 글에서 우리가 리액트의 컴포넌트에서 함수를 실행해 값을 바꿀 경우, 다른 사람들은 그 값을 바로 전달받지 못한다는 문제가 있었다. 이 문제를 해결하기 위해 컨트랙트와 리액트 컴포넌트 내부의 함수를 수정해 실시간으로 블록체인 네트워크에서 동작하는 스마트 컨트랙트의 상태를 확인할 수 있도록 해보자. 1. ganache 네트워크 재기동 ganache는 한 번 껏다가 다시 키면 네트워크가 전부 초기화 되기 때문에 내가 만든 계정이나 tx한 컨트랙트가 전부 사라진다. (윈도우의 경우) 지갑 같은 경우는 출력되는 주소들을 그냥 사용하면 되지만 컨트랙트의 경우 그 때마다 CA나 네트워크 ID, tx hash등이 달라진다. (네트워크 아이디는 한 블록체인 네트워크에 참여하는 노드들의 등록 번호라고 보면 된다.) ..

오늘은 truffle, ganache를 이용해 숫자 카운터 컨트랙트를 만들고 배포해보자. 그리고 이를 리액트를 이용한 웹 페이지에서 메타마스크를 통해 접근할 수 있도록 하는 디앱화 해보자. 1. 컨트랙트 생성, 배포 (#22 참조) 루트 디렉토리에 truffle 폴더를 만들고, 여기서 컨트랙트를 작성, 컴파일, 배포한다. npx truffle init 생성된 contracts 폴더에 다음과 같이 counter 컨트랙트를 만든다. /* truffle/contracts/Counter.sol */ // SPDX-License-Identifier: MIT pragma solidity ^0.8.15; contract Counter { uint256 private _count; function current() p..

오늘은 Truffle 프로그램을 이용해 내가 만든 컨트랙트를 네트워크에 배포하는 방법에 대해 알아보자. 우선 js 파일을 작성하고 이를 solc를 이용해 컴파일하고, 이를 web3 라이브러리를 이용해 블록체인 네트워크 상에 배포하는 것을 하드코딩으로 진행해봄으로써 Truffle 프로그램의 존재 이유와 장점을 알아보고, 이후 Truffle을 사용하는 것을 연습해보는 식으로 진행한다. 1. 하드 코딩으로 컨트랙트 배포 ( w/o Truffle ) web3와 node 내장 라이브러리를 이용해 컨트랙트를 배포해보자. npm init -y npm i web3 solc 컨트랙트는 저번에 사용했던 기본적인 기능만을 갖춘 컨트랙트를 사용한다. /* contracts/HelloWorld.sol */ // SPDX-Lic..

오늘은 간단한 스마트 컨트랙트를 솔리디티 언어를 이용해 만들어보고, 이를 이더리움 네트워크 안에 tx를 이용해 넣은 다음, 네트워크 상에서 이를 실행해보자. puppeth을 이용해 네트워크를 셋업한 후 진행하면 된다. 뭔가 이더리움 네트워크 안에서 코드를 실행하려면 1. 우선 솔리디티 언어를 이용해 컨트랙트를 만들고, 2. 이를 컴파일하고 (EVM이 읽을 수 있도록) 3. 컴파일한 내용을 이더리움 네트워크에 tx를 통해 올려주는 과정을 거치면 된다. 1. 솔리디티를 이용해 스마트 컨트랙트 작성 Contracts 폴더를 생성 후, 그 안에 HelloWorld.sol 파일을 만든다. /* Contracts/HelloWorld.sol */ // SPDX-License-Identifier ^0.8.15; con..