[몰라도 해보는 cryptoZombie] Lesson1. 좀비 공장 만들기 – 5(완)

https://cryptozombies.io/ko/course

챕터 13: 이벤트

이벤트

이벤트다. 이벤트라서 신나는 건 줄 알았는데 그런 건 아니다. 이벤트에서 이해하기 위해서는 웹 프로그래밍이 프론트엔드와 백엔드로 나누어진다는 사실과 블록체인은 백엔드를 담당하는 부분 중 한 영역이라는 사실을 알아야한다.

프론트엔드는 사용자가 접하는 인터페이스 부분을 만드는 부분이다. 화면에 어떻게 출력해야하는지를 만드는 부분이라 생각하면 된다. Html, css, javascript 보통 이렇게 세가지 언어로 구성된다. 백엔드는 서버로부터 화면에 출력할 내용을 가져오는 역할을 한다. 사용자랑 노는 부분이 아니라 서버랑 노는 부분이다. Javascript 기반의 node.js, python 기반의 Django, ruby 기반의 rails, java 기반의 spring 등… 지원하는 언어와 프레임워크는 다양하다. 여기에 블록체인이 추가되었다. 블록체인은 데이터 분산처리 기술이다. 서버랑 소통하는 부분을 백엔드라고 부르는데 Dapp은 그 서버가 분산화되어 있다. 그렇기 때문에 블록체인이 백엔드를 담당하는 부분이라는 것이다.

아무튼 그렇기 때문에 프론트엔드와 백엔드를 이어주는 가교 역할을 해줄 곳이 필요하다. 그 부분이 바로 event이다. 지금은 깊게 이해하지 않아도 괜찮다. 그저 백엔드에서 프론트엔드와 소통하기 위해서 만드는 부분이라고 생각하자. 즉, 백엔드에 있는 내용 중 우리 앱의 사용자에게 보여주고 싶은 내용이 있다면 event를 쓰면 된다.

event의 선언은 보통 contract 바로 아래에서 한다. 일반 함수의 선언과 비슷하다. function자리에 event라고 적는다는 점, 마지막에 {}이거 없이 끝난다는 점만 다르다.
그렇게 선언 후, 이 이벤트를 보여주고 싶은 부분에 함수를 쓰듯 써주면 된다.

contract ZombieFactory {

    event NewZombie(uint zombieId, string name, uint dna);// 여기에 이벤트 선언

    uint dnaDigits = 16;
    uint dnaModulus = 10 ** dnaDigits;

contract 밑에 위처럼 event를 선언한다. 지금 우리는 새로운 좀비가 만들어졌을때 사용자에게 새좀비가 생겼다고 zombieId와 name, dna를 보여주고 싶은거다.

이후 좀비가 생성되는 함수인 _createZombie에서 아래와 같이 이벤트를 추가해주자.

function _createZombie(string _name, uint _dna) private {
        uint id = zombies.push(Zombie(_name, _dna)) - 1;
        NewZombie(id, _name, _dna);// 여기서 이벤트 실행
} 

사실 이 부분에서 정말 할말 많다. event라는 개념만 설명하면 좋았을 챕터에 초보자들이 이해하기 힘든 방향으로 코드를 짜놨다.

문제 풀이를 진행 전 코드는 아래와 같다.

function _createZombie(string _name, uint _dna) private {
        zombies.push(Zombie(_name, _dna));
} 

사실 이벤트를 실행시키는건 어려운 일이 아니다. 이벤트를 실행시키라는 자리에 함수 쓰듯이 쓰면된다.
그런 생각으로 작성해보면.. NewZombie( 까지 쓰고 멈칫하게 된다. zombieId를 받아야하는데 zombieId를 받아올 곳이 없다. 일반적으로 처음 만들어진 놈 순서대로 1, 2, 3, 하고 넘버링을 하니까 여기서도 그런 방식으로 넘버링 하고자 한다. 그래서 생각해보면.. 지금 zombies라는 배열에 만들어진 좀비를 밀어 넣고 있으니까.. 저 배열의 개수를 가져와서 zombieId로 삼으면 되겠다는 생각을 제작자는 했던 것 같다. 그러면 저 배열의 숫자를 가져오면 되겠네 싶어서 .length() 메소드를 쓰려고 했는데 어라? .push()를 쓰라고 한다. .length()의 경우 배열의 길이를 반환하고 끝나는 녀석이고, .push()는 ()안에 녀석을 밀어 넣고 배열의 길이를 반환한다. 그래서 번거롭게 – 1을 해줘야된다. 그뿐만 아니라 push()의 ()안에 뭔가 배. 열에 밀어넣어야 하는걸 적어야하는데.. 그래서 위에 적었던 Zombie(_name, _dna)를 집어 넣는다.

그리고 생각해보니 이렇게 쓰면 같은 좀비가 배열 안에 두번 들어가게 되잖아?
그래서 쿨하게 위에 줄을 날린다. 그게.. 저 정답 값이 산출된 방식인듯 싶다. (굳이 저렇게 코드를 짠 이유가 있을지도 모르지만 내 실력이 허접해서 이해를 못하겠다.)

function _createZombie(string _name, uint _dna) private {
        zombies.push(Zombie(_name, _dna));
        uint id = zombies.length;
        NewZombie(id, _name, _dna);
} 

사실 이렇게 작성하고 넘어갔으면 이해가 훨씬 쉬웠을텐데…

챕터 14: Web3.js

뭐야 이건. 한줄 한줄 힘들게 코드를 따라치며 공부했더니 갑자기 Web3.js라는 걸 보여주면서 생소한 코드를 폭격한다. 이해 못해도 좋다. 그냥 ‘이게 프론트엔드쪽이고 이때 Web3.js라는 javascript기반 라이브러리를 쓰는구나.’ 정도만 알고 넘어가자. 옆에 좀비를 가지고 놀다가 다음 챕터로 넘어가자.

챕터 15: lesson1 끝

와우. 끝났다.

https://share.cryptozombies.io/ko/lesson/1/share/뭐라도먹어야힘을쓰지?id=Z29vZ2xlLW9hdXRoMnwxMDg1MTg0MjY2MzAxNTkwNjI1MTU=
이것이 내 좀비 링크란다. 내가 입력하는 좀비 이름에 따라 모양이 바뀌는걸 보면서 우리가 짠 코드가 잘 동작하는구나만 느껴보자. Lesson1이 끝났다. 이제 lesson 5개 남았다.

---

참고문헌
https://d2fault.github.io/2018/03/19/20180319-about-solidity-1/

코어 이더리움 프로그래밍 – 박재현, 오재훈, 박혜영