블록체인 NFT 토큰게이팅 관련 프로젝트를 진행중 MetaMask를 통해서 로그인을 구현한 방법을 리마인드하고 코드리뷰와 개념정리를 할 겸 블로그 글로 남겨보려고 합니다. web3.js와 MetaMask를 연동하면 사용자가 웹 어플리케이션에 안전하게 로그인할 수 있습니다. 이번 포스팅에서는 MetaMask와 web3.js를 연동하는 방법과 이를 통해서 로그인 기능을 구현하는 전체적인 과정을 살펴보도록 하겠습니다. 사전준비사항시작하기전에 진행한 코드의 환경과 준비사항은 다음과 같습니다. 1. Next.js 프로젝트 환경2. MetaMask를 브라우저에 설치.3. web3.js 자바스크립트 라이브러리를 프로젝트에 설치 MetaMask와 Web3 연동 1. useEffect 훅을 활용해 Web3 초기화 및 M..

클로저는 함수와 그 외부상태를 결합한 것으로, 데이터 은닉과 콜백을 생성하는 유용한 개념입니다. JS 언어를 사용하는 개발자라면 한번쯤은 알게모르게 사용한 경험이 있을 것 같습니다. 자바스크립트에서 정말 중요한 개념이라고 생각해서, 이의 장점과 단점을 이해하고 코드를 작성한다면 코드의 질이 달라지지 않을까 생각이 듭니다. 클로저(Closure) 기본 개념 🐶클로저(Closure)란 외부 변수를 접근하는 가장 강력한 개념입니다. 즉 함수와 함수가 선언되었을 때의 렉시컬 환경의 조합입니다. 자신의 중괄호 외부의 값을 접근할 수 있으며, 이 과정에서 메모리의 힙을 활용하여 참조 가능한 변수를 저장함으로써 불필요한 데이터 노출을 방지합니다. 또 이를 이용해 자바스크립트(javascript) API 사용 시 더..