로메오의 블로그

DApp을 만들기 위해서 Solidity로 투표하기 App을 만들었습니다. [DAPP] WATCH EVENT LISTENER 그런데 Front-end 화면 개발을 단순한 html과 jquery를 이용해서 간단하게 구현했었는데요. 이것을 React.js프레임워크를 이용해서 Refactoring 해보겠습니다. 물론 코드를 간단하게 하기 위해서 Bootstrap같은 디자인 적인 요소는 사용하지 않겠습니다. webpack-cli 설치 $ npm install -g webpack-cli webpack-cli 를 글로벌로 설치합니다. React.js 환경 설정 babel 설치 $ npm install --save-dev @babel/core @babel/preset-env @babel/preset-react bab..

마지막으로 Watch Event Listener를 사용해보겠습니다. [DAPP] 투표하기 화면 구현 투표하기에 성공하면 location.reload()로 화면을 강제로 새로고침하였습니다. Election back-end 코드에서 이벤트가 발생했을때 화면으로 이벤트를 전달해 보도록 하겠습니다. /contracts/Election.js pragma solidity ^0.5.0; contract Election { .... // 투표하기 Watch Event event votedEvent ( uint indexed _candidateId ); // 투표하기 function vote(uint _candidateId) public { .... // 이벤트 트리거 emit votedEvent(_candidateId..

우리는 위와 같은 화면을 구현합니다. [DAPP] SOLIDITY FRONT-END ELECTION에서 후보자 읽어오기 위 포스트에 이어서 투표하기 코드를 추가하겠습니다. 먼저 Election.sol 에서 constructor에서 3명의 후보자를 추가하겠습니다. /contracts/Election.sol pragma solidity ^0.5.0; contract Election { .... // constructor constructor() public { addCandidate('romeoh'); addCandidate('doraemong'); addCandidate('pororo'); } .... } constructor에 위와 같이 코드를 추가합니다. 전체 코드는 아래와 같습니다. pragma so..

[DAPP] 투표하기 테스트 코드 작성 위 포스트에 이어 계속 테스트코드를 작성합니다. /test/election.spec.js const Election = artifacts.require('./Election.sol') contract('Election', accounts => { .... it('투표 유효성 검사', () => { return Election.deployed() .then(instance => { electionInstance = instance // 유효하지 않은 후보자에게 투표한다. return electionInstance.vote(99, {from: accounts[0]}) }) .then(assert.fail) .catch(error => { assert(error.mess..

중복투표를 방지하기 위해 vote 메서드에 코드를 추가하겠습니다. /contracts/Election.sol pragma solidity ^0.5.0; contract Election { ... // 투표하기 function vote(uint _candidateId) public { // 중복투표를 하면 오류를 발생 시킨다. require(!voters[msg.sender]); // 목록에 없는 후보자에게 투표하면 오류를 발생시킨다. require(_candidateId > 0 && _candidateId Candidate) public candidates; // 투표에 참여한 ID 기록 mapping(address => bool) public voters; // 후보자 등록하기 function addC..

앞에서 작성한 투표하기 solidity 코딩에 대한 테스트 코드를 작성합니다. [DAPP] SOLIDITY TEST 코드 작성하기 위 포스트에 이어 테스트 코드를 추가합니다. /test/election.spec.js const Election = artifacts.require('./Election.sol') contract('Election', accounts => { .... it('투표하기', () => { return Election.deployed() .then(instance => { electionInstance = instance candidateId = 1 // 1번 후보자에게 투표함 return electionInstance.vote(candidateId, {from: accounts[..

/contracts/Election.sol 추가하기 pragma solidity ^0.5.0; contract Election { .... // 투표에 참여한 ID 기록 mapping(address => bool) public voters; .... // 투표하기 function vote(uint _candidateId) public { // 투표에 참여한 ID를 기록해서 두번 투표하지 못하도록 한다. voters[msg.sender] = true; // 득표수를 +1 한다. candidates[_candidateId].voteCount ++; } } 위와 같이 voters 데이터와 vote 메서드를 추가합니다. 그리고 constructor에서 3명의 후보자를 추가한 코드를 주석처리 합니다. 최종 코드는..

CANDIDATE 등록, 확인하기 Solidate로 작성한 Back-end 코드는 위 포스트를 그대로 사용합니다. 다만 constructor에 후보자를 미리 3명 정도 등록하는 코드를 추가하겠습니다. /contracts/Election.sol pragma solidity ^0.5.0; contract Election { // 후보자 모델 struct Candidate { uint id; string name; uint voteCount; } // 후보자 기호 변수 uint public candidatesCount; // 후보자 매핑 mapping(uint => Candidate) public candidates; // 후보자 등록하기 function addCandidate (string memory _n..