- 지금가지의 화면 구현은 클래스로 리액트 컴포넌트를 만들고, 리액트 부트스트랩으로 화면 요소를 구성하였다.
(js + html + css 등)
- 그렇다면 화면에서 어떻게 이더리움에 배포된 컨트랙트와 상호작용을 할까?
바로 자바스크립트의 web3 라이브러리가 연결고리이다.
- 트러플 리액트 박스의 역할이 개발에 필요한 모듈들도 패키지로 제공해 주지만, 추가로 이러한 연결고리들을 함수로 구현해 놓은 것을 제공하는 것이다.
- 우리는 메타마스크를 통해서 이더리움의 트랜잭션을 보내는데 이것을 "Injected web3" 라고한다.
app은 어느 이더리움 네트워크에 연결하는지에 대한 설정 근거를 가지고 있지 않다.
이 설정을 메타마스크에서 하는것이다.
- 트러플에서 컴파일한 결과물 즉, json 형태의 파일(ABI)은 truffle-contract라는 모듈을 사용해서 해당 컨트랙의
명세를 가져온다음에 그것을 이용해서 컨트랙트의 메소드를 호출하는 것이다. 메소드 호출은 메타마스크를 통해
이더리움으로 전송될 것이다.
728x90
'Block Chain Development' 카테고리의 다른 글
NFT Dapp 개발 연습 #2(판매 스마트 컨트랙트) (0) | 2022.04.07 |
---|---|
NFT Dapp 개발 연습 #1(개발환경 세팅 및 스마트 컨트랙트) (0) | 2022.04.07 |
이더리움 기반 Dapp 개발 연습 #11 (화면구현3) (0) | 2022.02.19 |
이더리움 기반 Dapp 개발 연습 #10 (화면구현2) (0) | 2022.02.13 |
이더리움 기반 Dapp 개발 연습 #9 (화면구현1) (0) | 2022.02.11 |