폴리곤5 [220518] 구매 버튼 만들기 components/SaleAnimalCard.tsx 생성 현재 판매중인 이미지와 텍스트를 가져오는 코드 import { Box, Button, Text } from "@chakra-ui/react"; import React, { FC } from "react"; import { web3 } from "../web3Config"; import AnimalCard from "./AnimalCard"; interface SaleAnimalCardProps { animalType: string; animalPrice: string; } const SaleAnimalCard: FC = ({ animalType, animalPrice, }) => { return ( {web3.utils.fromWei(animal.. 2022. 5. 18. [220518] 가격 등록 하기 my-animal.tsx {animalCardArray && animalCardArray.map((v, i) => { return ; // return 이후를 수정한다. })} components/MyAnimalCard.tsx 생성 import { Box, Button, Input, InputGroup, InputRightAddon, Text, } from "@chakra-ui/react"; import React, { FC } from "react"; import { web3 } from "../web3Config"; import AnimalCard from "./AnimalCard"; // 구조를 만들때 타입스크립트에서 쓰이는 interface export interface IMyAnimalCard .. 2022. 5. 18. [220517] 판매 등록 하기 1. setApprovedForAll에서 판매등록하기 setApprovedForAll 코드로 구현하기 // 판매등록하는 setApprovesForAll 기능 구현 const onClickApproveToggle = async () => { try { if (!account) return; // 계정이 없으면 return const response = await mintAnimalTokenContract.methods .setApprovalForAll(saleAnimalTokenAddress, !saleStatus) .send({ from: account }); // 주의! call이 아니고 transact 기능 구현!! if (response.status) { // 값이 변했다는 신호 setSaleSta.. 2022. 5. 17. 메타마스크를 뭄바이 테스트 서버와 연결하기 / 테스트 코인 받기 메타마스크에 접속 후, 보기/숨기기 클릭 테스트 네트워크 켜기 네트워크로 돌아가 네트워크 추가 클릭 https://faucet.polygon.technology/ 뭄바이 테스트 네트워크 사이트에 들어가면 각각에 해당하는 정보가 있다. 보면서 입력 nft 등록을 지원하는 폴리곤 MATIC토큰 사이트 https://faucet.polygon.technology/ 한국어로 번역하면 수도꼭진데.. 그냥 지원 사이트라고 하겠음. nft 등록할때 발생하는 소량의 MATIC을 지원해준다. 자신의 지갑 주소를 복사한 후, Wallet Address에 등록하면 지원코인을 줌. 현재 스무번째 시도중인데 연결이 안됨. 뭐지.. 2022. 5. 17. [220517] 리액트와 메타마스크 연결하기 web3, web3-utils 설치 $ npm i web web3-utils web3 import 하기 CONTRACT에서 saleAnimalToken, mintAnimalToken을 선택해서 각각 ABI를 복사해 아래 코드에 붙여넣는다. import {AbiItem } from 'web3-utils'; // 인터페이스가 정의된 파일 const mintAnmimalTokenAbi: AbiItem[] = 복사한 Abi 붙여넣기; const saleAnmimalTokenAbi: AbiItem[] = 복사한 Abi 붙여넣기; web3로 로그인 ENVIRONMENT를 Injected Web3로 연결하면, 메타마스크로 자동 연결이 되면서 연결상태로 바뀐다. 리액트에게 ethereum 오브젝트를 인식시키는 코드 r.. 2022. 5. 17. 이전 1 다음
