이더스캔 만들기

이더스캔 만들기

 

[목표]

 

이더스캔에서는 블록넘버, 트랜잭션해시, 어카운트 주소를 통해 

데이터를 조회할 수 있다.

 

가나슈에서 테스트 환경의 블록체인을 만들고

브라우저에서 UI 환경을 구축하여 

 

내가 만든 블록체인의 블록넘버, 트랜잭션해시 값을 넣고

해당 데이터를 조회할 수 있는 웹을 구축한다.

 

 

npm install -g ganache-cli

가나슈가 설치되어있지 않다면

위 명령어로 프로젝트 어디서나

 

가나슈를 사용할 수 있도록

전역으로 설치한다.

 

 

ganache-cli

가나슈 설치가 끝나면 위 명령어로 가나슈를 실행한다.

 

 

 

가나슈가 정상적으로 실행되면

위와 같이 10개의 계정이 생성된다.

 

리믹스 > Deploy & Run Transactions 탭에서

환경을 Web3 Provider로 설정한뒤 가나슈와 연동한다.

그러면 Account에 가나슈에서 생성된 어카운트들을 선택할 수 있다.

 

 

 

• 블록 익스플로러

Visual Studio Code에서

디폴트 브라우저로 열기 위해

"open in browser"를 설치했습니다.

 

블록 브라우저 기본화면

기본 UI는 위와 같습니다.

 

Accounts 버튼을 누르면 블록에서 생성한 계정들을 모두 불러옵니다.

 

 

리믹스에서도 할 수 있지만

 

블록생성을 위해 이더리움을 전송할 수 있는

웹페이지를 하나 더 만들었습니다.

 

여기서 트랜잭션 10개를 발생시켰습니다.

 

우측상단에서

최근 발생한 블록과 트랜잭션을 표시합니다.

 

 

recent block 버튼을 누르면

최근 생성된 블록 넘버의 값을 가지고

web3를 통해 해당 블록의 정보를 받아

브라우저 하단에 테이블로 출력합니다.

 

마찬가지로 recent Tx 버튼을 누르면

최근 생성된 트랜잭션의 정보를 불러옵니다.

 

가운데 조회 버튼에 인풋 값에

블록 넘버를 넣으면 블록 넘버 값의 데이터가 조회 되고

트랜잭션 해시를 넣으면 트랜잭션 데이터가 조회 됩니다.