[Daily Post] 230405

[Daily Post]는 매일매일 탐구한 내용을 간략하게 기록하는 포스트입니다.
따라서 정리되지 않은 내용과 추측을 포함하고 있을 수 있습니다.
더 체계적인 형식을 갖춘 글은 해당 카테고리의 포스트를 확인해주세요 :)

Daily Study

Alchemy

• 핵심: Front-end와 Smart contract의 상호작용
  • Front-end framework로는 React를 사용하며, 다음 재생목록과 비슷한 수준의 Prerequisite을 요구
• Pinata를 이용해서 ipfs 네트워크에 링크를 저장하는 것 같다. 근데 Pinata에서 API 키와 이에 대한 access token을 안전하게 보관할 수 있는 방법으로 dotenv를 Alchemy에서 제시한다.

Error 1.

require("dotenv").config();
const alchemyKey = process.env.REACT_APP_ALCHEMY_KEY;
const { createAlchemyWeb3 } = require("@alch/alchemy-web3");
const web3 = createAlchemyWeb3(alchemyKey);

• 튜토리얼을 그대로 따라가고 있었고, REACT_APP_PINATA_KEY와 REACT_APP_PINATA_SECRET에 이어서 REACT_APP_ALCHEMY_KEY를 추가하기 위해 위와 같은 코드를 입력하니 npm start를 실행해둔 터미널에서 아래와 같은 에러메세지가 반환됐다.

Failed to compile.

./node_modules/web3-core-method/lib/index.js 152:76
Module parse failed: Unexpected token (152:76)
File was processed with these loaders:
 * ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
|   if (Array.isArray(result)) {
|     return result.map(function (res) {
>       return _this.outputFormatter && res ? _this.outputFormatter(res, this?.hexFormat) : res;
|     });
|   } else {

• React 빌드 중에 compile fail을 본 것은 처음이라.. 당황스럽지만 일단 중요해보이는 것을 짚으면 다음과 같다.