본문 바로가기

메타마스크14

[220808-0925] NFT마켓 프로젝트 목적 영상이나 음원의 저작권을 거래하는 사이트. 영상이나 음원의 조회수에 따라 사이트는 해당 영상이나 음원 소유자에게 수익금을 분배해준다. 영상과 음원은 각각 토큰으로 만들어져 거래가 된다. 08.08 ~ 08.22 / 담당한 파트를 위한 공부기간 나는 이 중에서 경매사이트를 담당하게 되었다. 리액트는 대충 알아도 솔리디티는 기초만 알고있는 상태. 크립토좀비를 풀어서 기초를 다시 다지고, 다른 사람들의 nft마켓 코드들을 구글링해봐야겠다. 08.12 역시 기초와 실전코딩은 다르다. 크립토좀비만 떼면 될 줄 알았는데 실제로 코딩을 잡아보니 어디부터 손을 대야할지 막막하다. 마침 감사하게도 다른 팀의 nft마켓을 구현한 팀프로젝트 코드를 얻을 수 있어서 우선 그걸 뜯어봐야겠다. 08.20 경매사이트 코드를 .. 2022. 9. 14.
[220701] GETH로 RPC 통신하기 / 메타마스크 연결하기 사용할 디렉토리에 geth 세팅하기 node 파일 안에 keystore 디렉토리가 생성되며 account 파일이 생성하는 코드. $ mkdir `node` $ source ~/.bash_profile $ geth --datadir node account new node 파일 안에 keystore파일과 계정이 담긴 파일이 생성된걸 볼 수 있다. 터미널을 새로 켜고 go-ethereum이 설치된 위치로 가서 다음 코드를 실행하면 여러파일이 생긴다. $ make all 그 중에서 build/bin 디렉토리 안에 가면 puppeth와 bootnode가 설치되었는지 확인한다. puppeth은 설정을 도와주고, bootnode는 네트워크 피어연결을 도와주는 서버다. puppeth 세팅하기 네트워크 이름, 네트워크 .. 2022. 7. 6.
[220518] 구매기능 만들기 SaleAnimalCard.tsx import { Box, Button, Text } from "@chakra-ui/react"; import React, { FC, useEffect, useState } from "react"; import { mintAnimalTokenContract, saleAnimalTokenContract, web3, } from "../web3Config"; import AnimalCard from "./AnimalCard"; interface SaleAnimalCardProps { animalType: string; animalPrice: string; animalTokenId: string; account: string; getOnSaleAnimalTokens: () =>.. 2022. 5. 18.
[220518] 판매자 정보 가져오기 SaleAnimalCard.tsx import { Box, Button, Text } from "@chakra-ui/react"; import React, { FC, useEffect, useState } from "react"; import { mintAnimalTokenContract, web3 } from "../web3Config"; import AnimalCard from "./AnimalCard"; interface SaleAnimalCardProps { animalType: string; animalPrice: string; animalTokenId: string; // 계정을 확인하기 위해 필요한 정보 account: string; // 계정을 확인하기 위해 필요한 정보 } const Sa.. 2022. 5. 18.
[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] 판매페이지 작성하기 구현하려는 기능 onSaleAnimalTokenArray 인덱스 값을 넣었을때 몇번째인지(=tokenId) 값을 알려줌 getAnimalTokenPrice tokenId를 입력하면 가격을 알려줌 (Wei 기준) animalTypes 인덱스 값을 넣었을때 뽑은 카드가 몇번인지 알려줌. animalTokenPrices 뽑은 카드 번호를 입력하면 얼마인지 알려줌. (중복값이 나오는 경우는 어떻게 나오지) 코드 구현 sale-animal.tsx import React, { FC, useEffect, useState } from "react"; import { Grid } from "@chakra-ui/react"; import { IMyAnimalCard } from "../components/MyAnimal.. 2022. 5. 18.
[220518] 최적화를 위한 리팩토링하기 MintAnimalToken.tsx // SPDX-License-Identifier: MIT pragma solidity ^0.8.0; import "@openzeppelin/contracts/token/ERC721/extensions/ERC721Enumerable.sol"; import "SaleAnimalToken.sol"; // MintAnimalToken이 SaleAnimalToken보다 먼저 생성되므로 // 자동적으로 가져올 수 없으니 임의로 import 해주기 contract MintAnimalToken is ERC721Enumerable { constructor() ERC721("h662Animals", "HAS") {} SaleAnimalToken public saleAnimalToken;.. 2022. 5. 18.
[220518] 판매 버튼 만들기 입력창에 가격을 입력하고 Sell 버튼을 누르면 가격이 등록되게 만들기 MyAnimalCard.tsx import { Box, Button, Input, InputGroup, InputRightAddon, Text, } from "@chakra-ui/react"; import React, { ChangeEvent, FC, useState } from "react"; import { saleAnimalTokenContract, web3 } from "../web3Config"; import AnimalCard from "./AnimalCard"; export interface IMyAnimalCard { animalTokenId: string; animalType: string; animalPrice: s.. 2022. 5. 18.
[220518] 민팅했었던 주소로 접속하기 내가 자꾸 까먹어서 작성하는 글 리믹스를 껐다가 다시 켜면 다시 처음부터 진행해야하는데, 민팅을 진행했던 예전 작업으로 돌아가고 싶을때는 예전 주소를 찾아와 진행하면 된다. // 개별적으로 적어놓은 주소 const mintAnimalTokenAddress = "민팅했던 주소"; export const saleAnimalTokenAddress = "판매등록했던 주소"; CONTRACT > MintAnimalToken / SaleAnimalToken 해당하는 목록 선택 At Address에 해당하는 주소를 입력하고, At Address를 클릭하면 개체가 생성된다. 2022. 5. 18.
[220517] 민팅한 이미지를 모아보는 마이페이지 만들기 민팅한 이미지를 모아보는 마이페이지 만들기 my-animal.tsx import { Grid } from "@chakra-ui/react"; import React, { FC, useEffect, useState } from "react"; import AnimalCard from "../components/AnimalCard"; import { mintAnimalTokenContract } from "../web3Config"; // props에서 account를 내려줬으니까 interface MyAnimalProps { account: string; } // 내려준 account 받기 const MyAnimal: FC = ({account}) => { // 동물 리스트를 담을 state 생성 // 동.. 2022. 5. 17.

티스토리툴바