github : https://github.com/codestates/BEB1stProject-05
🔥 진행한 부분
어제 오늘 해서 많은 작업을 진행하려고 했지만 개인적인 일이 생겨가지고 작업을 진행하지 못했습니다...ㅠㅠ
팀원분에게 요청하고 하고싶은 작업을 해달라고 부탁을 해놓은 상태에서 일을 처리하고 안되는 부분을 수정하였습니다.
일단 팀원분은 NFT를 만들떄에 인지할수 있는 주소의 값을 원하셨습니다.
이를 ipfs를 통해서 해결을 하려고 하셨고 성공적으로 기본적인 틀?? 부분은 짜놓으신 상태였습니다.
- 이 부분이 참 대단하시더라구요.. 어디서 알아오셨는지..?
팀원 분이 작성한 부분
const IpfsApi = require("ipfs-api");
const ipfs = IpfsApi("ipfs.infura.io", "5001", { protocol: "http" });기본적으로 ipfs를 사용하기 위한 모듈을 불러오고 네트워크를 설정을 합니다.
그후 배포 버튼을 누르게 되면
내가 작성한 부분
const ipfsUpload = async (req, res) => {
await ipfs.add(Buffer.from(img)).then((result) => {
SetLink(`https://ipfs.io/ipfs/${String(result[0].path)}`);
});
};
await ipfsUpload();- 팀원분도 이 부분에 대해서 나름대로 작성을 하셨지만 정상적으로 작동을 하지 않아서 제가 수정을 하였습니다.
저도 처음 사용해 보는 ipfs인지라... 어떻게 이루어져 있고 작동을 하는지 우선 console.log(ipfs)를 통해서 알아 보았고
이후 add함수를 추가적으로 붙여서 사용한다는 점을 활용하여 ipfs.add를 활용 하였습니다.
add함수는 인자로 아무것도 받지 않지만 Array.from()들어오는 인자값을 사용하는 함수 였습니다.
- 떄로는 console.log가 가장 무식하지만 가장 확실한 방법이기도 하죠...ㅎㅎ
그러기 떄문에 특정 인자를 넣어보았고 그러면
이런 오류를 내뱉었습니다.
- 이 부분은
ipfs.add("abc")를 넣어 보았습니다.
오류 코드를 보면 알수 있듯이 인자는 buffer, stream, object등등이 가능하였습니다.
저희는 이 부분에 img파일을 담아야 했고 이는 byte64로 인코딩 되어 있는 값이기 떄문에 저는
Buffer.from을 활용하여 성공적으로 인자를 전달 하였습니다.
그후 새로운 주소를 return 받아서 변수에 할당하고
그후 트랜잭션을 발생시키는 로직을 통해서 새로운 주소, 이름, 부가 설명 데이터를 담아서 NFT로 만들고 이것을 트랜잭션 데이터에 포함하여 트랜잭션을 발동 시켰습니다.
보이는 바와 같이 주소, 이름, 부가설명 데이터가 컨트랙트에서 도출이 되게 됩니다.
- 값이 없는 부분은 테스트 용으로 전송해본 결과 입니다.
- 이 값은 컨트랙트에서 가져온 값 입니다.
🔥 후기 및 느낀점
처음 해보는 작업을 진행하였기 때문에 배운점이 많앗다고 느끼지만
그만큼 시간을 많이 투자하지 못해서 인지 추가적인 프로젝트 작업을 진행하지 못한것이 많이 아쉽습니다..ㅠㅠ
ipfs라는 부분을 직접적으로 활용해보는 시간을 가질수 있었고
뭔가 기존의 byte64로 도출되는 주소보다 좀더 간단하다는 점에서 유리한것 같습니다.
프로젝트 기간이 1~2일 정도밖에 남지 않았고 ㅠㅠ 그러기 떄문에 할수 있는 최대한의 작업을 진행해보고자 합니다.
DB추가 과정까지 해보고 싶지만 가능할지는 모르겠네요 ㅠㅠ
