[해커톤] Seoul Web3.0 Festival 해커톤 참가 후기

ABI와 컨트랙트 주소는 이상이 없었고, 배포된 컨트랙트를 Remix 상에서 transfer함수를 호출하여 다른 팀원의 월렛으로 토큰 전송까지 확인해 컨트랙트에 이상이 없다고 판단했습니다. 하지만 연동부분이 개발자도구에서 확인했을 때, 오류가 계속 발생했습니다. 컨트랙트 연동부분에서 개발멘토인 정윤님이 많이 도와주셨습니다. 감사합니다!

컨트랙트와 리액트 연동부분입니다.

 // 컨트랙트 관련
  // Infura Goerli
  const infuraUrl = `인퓨라 url`;
  const web3 = new Web3(infuraUrl);

  // 컨트랙스 주소와 ABI 정의
  const contractAddress = "0xd9973163F044268417c7b50C0A571d293B6da5B4"; // 컨트랙트 주소
  const contractABI = [
    [
    ..내용이 길어서 생략.. 
  ];

  // 컨트랙트 인스턴스를 생성합니다.
  const contract = new web3.eth.Contract(contractABI, contractAddress);
  //기부 수량 =================================
  const [donationAmount, setDonationAmount] = useState("");
  const [receiverAddress, setReceiverAddress] = useState("");
  const handleReceiverAddressChange = (e) => setReceiverAddress(e.target.value);
  // 댓글 입력 값이 변경될 때 호출되는 함수
  const handleDonationAmountChange = (e) => {
    // 댓글 입력 값을 상태(state)에 저장
    setDonationAmount(e.target.value);
  };

  // (병합) [댓글 등록 버튼을 클릭했을 때 호출되는 함수
  const handleDonationSubmit = () => {
    // 댓글 등록 처리 로직 추가

    console.log("컨트랙트 주소: ", contract);
    console.log("수량 입력: ", donationAmount);
    //console.log("기부 대상자 지갑주소: ", selectedContent.address);

    // 댓글 입력 값을 초기화
    //setDonationAmount("");
  };
  const totalButton = () => {
    handleDonationSubmit();
    handleCloseAndOpen();
    handleDonation();
  };
  //  이더리움 기부 처리 함수 (미정)
  const handleDonation = async () => {
    try {
      const accounts = await web3.eth.getAccounts(); // 사용자 계정 가져오기
      const sender = "0x2401bC67706121CCa309d6cd01a05E2fdF9Cff4a";

      //const sender = accounts[0]; // 보내는 사람의 주소
      const receiver = selectedContent.address; //{selectedContent.address}; // 기부 대상자 지갑 주소
      console.log("보내는 사람 주소 ", sender);
      console.log("기부 대상자 지갑주소 진짜: ", receiver);
      const amount = web3.utils.toWei(
        /*이더리움의 양*/ donationAmount,
        "ether"
      ); // 이더리움의 양을 Wei 단위로 변환

      // 이더리움 전송하기
      const receipt = await contract.methods
        .sendEther(receiver)
        .send({ from: sender, value: amount });

      console.log(receipt);
    } catch (err) {
      console.error(err);
    }
  };

  //-- 컨트랙트 관련

2일차의 밤
최종 코드 제출은 마지막날 오전 7시 30분이기 때문에 대부분의 팀이 대회장에서 밤을 새웠습니다. 밤 12시쯤 팀원들과 라면을 먹었습니다! 먹는 동안 구현하지 못한 부분에 대한 걱정은 살짝 덜어 놓았습니다. 식사는 오른쪽과 같이 나왔습니다!

라면 말고도 빈츠, 스니커즈 등도 많았습니다.

3일차 본선진출!

예선 발표을 위해 나머지 팀원들이 PPT, 사업계획서(한글, 영문), 사용 영상을 준비하고 있었습니다. 저는 컨트랙트와 리액트 연결을 위해 방법을 오전 5시까지 계속 찾아보고 있었는데요. 결국에는 방법을 찾지 못해 프론트에서 오류가 나지 않을 정도까지만 구현을 했습니다. 지금도 그 문제를 해결하고 싶어 자바스크립트 문법과 리액트를 이용한 웹3 프로젝트를 공부하고 있습니다.

오전 7시 30분에 최종 제출이 완료되고, 팀원들과 아침을 마지막으로 먹고 DDP에서 낮잠을 잤습니다. 다들 잠을 못자서 그런지 약 30분동안 DDP의 하늘을 보며 푹 자다가 8시 53분에 잠이 깨 예선 발표에 늦지 않도록 대회장으로 들어갔습니다. DDP에서 왜 그렇게 누워있는지 알 것 같습니다. 오전 9시에 랜덤으로 예선 발표가 정해졌는데, 저희 팀이 첫번째로 배정됐습니다.

첫번째 호명이라 긴장되었을텐데, 도윤님이 본선 통과라는 멋진 결과를 가져오셨습니다 👍 본선 발표 대상자는 본선 발표 시간 대 호명하면 통과하는 걸로 바로 알려주진 않았습니다. 그래서 더 떨렸습니다. 그때 너무 놀라서 손이 떨리는 상태로 앞쪽으로 가 본선 발표 영상을 찍은 기억이 납니다.

2PO 학회는 올해 3월 말에 만들어진 신생 학회입니다. 첫 해커톤에서 본선 진출이라는 쾌거를 이뤄 너무 행복했습니다. 또한 2PO 학회에서 멘토님 포함 총 3팀이 모두 본선 진출을 하고 해커톤 멘토님 팀에서는 2등을 수상했습니다!!

모든 수상이 끝나고 해커톤 참가 확인서를 받았는데, 드디어 끝이 났구나 라는 생각이 들었습니다. 대회장 내부에서는 외부와 차단되어 해가 뜨는지 지는지도 모르고 3일동안 개발을 했습니다. 시간이 느리게 가는 듯 하면서도 빨리 갔습니다.

밤 8시가 되어서야 DDP를 나올 수 있었는데, 하늘이 너무 예뻐서 사진을 찍었습니다. 첫 해커톤 동안 부족한 점을 느꼈고 앞으로 나아갈 수 있는 에너지와 방향성을 얻을 수 있었습니다. 팀원분들, 학회장님, 멘토님들, 피드백 주셨던 넥슨, 라인 개발자님들 모두 감사합니다. 앞으로 더 나아가겠습니다. 2PO 파이팅