HUMBLE GROUND

블록체인 서비스 블록체인 서비스를 만들기 위해서는 크게 3가지 파트로 나눠진다 1. 블록체인 네트워크 (Blockchain Network) 👉 ex) 이더리움, 솔라나, 폴리곤, 하이퍼레저 패브릭 등 2. 체인 코드 (Chain code) = 스마트 컨트랙트 하이퍼레저 패브릭 👉 Go lang / Java / Javascript (Node js) 이더리움 👉 솔리디티 솔라나 👉 러스트 3. 디앱 (DApp, Decentralized Application) 프론트엔드 백엔드 퍼블릭 블록체인 이더리움, 솔라나, 폴리곤, 폴카닷, 클레이튼 등 👉 솔리... Read More

🦁 [PROJECT LION] NFT 블록체인 마켓 앱 만들기 with 그라운드X 3기 - 챕터 5-6 회고 NFT 판매 & 구매 기능구현 -1. Klip 지갑을 연결하고 이미지 링크를 붙여넣어 이미지를 NFT로 만든다 👉 NFT 발행 컨트랙트 실행 👆 NFT 민팅이 성공하면 Alert 알림창이 뜬다 ⭐ 컨트랙트를 실행할때는 수수료(KLAY) 가 발생한다 -2. NFT가 발행됐다면 하단에 WALLET 탭에서 보유중인 NFT를 확인할 수 있다 -3. Klip API를 axios 로 받아온 후 type: "execute_contract" 의 파라미터를 입력하지않고 인... Read More

🦁 [PROJECT LION] NFT 블록체인 마켓 앱 만들기 with 그라운드X 3기 - 챕터 5-5 회고 이미지 링크로 NFT 민팅하기 -1. 이미지 링크를 붙여넣으면 NFT 발행을 할 수 있도록 Input 창을 만들어 준다 이미지링크를 target.value로 읽어와서 useState에 담아주고 value 값으로 그대로 전달한다 <Form.Group> <Form.Control // text input 창 value={mintImgUrl} // 이미지를 띄워주는 value onChange={(e) => { setMintImgUrl... Read More

🦁 [PROJECT LION] NFT 블록체인 마켓 앱 만들기 with 그라운드X 3기 - 챕터 5-4 회고 KIP-17 KIP-17은 ERC-721 토큰에서 파생되었다 ‘KIP-17’ 기반으로 발행된 토큰은 대체가 불가능하다 👉 대체 불가능 토큰 (NFT, Non-Fungible Token) NFT 발행하고 조회하기 -1. Klaytn IDE 에서 ‘KIP-17’ 스마트 컨트랙트 코드 배포(Deploy) ⭐ Klip 은 테스트넷(Baobab) 에서 실행을 못하기때문에 메인넷에서 사용할 실제 KLAY 가 필요하다 ❗ ... Read More

🦁 [PROJECT LION] NFT 블록체인 마켓 앱 만들기 with 그라운드X 3기 - 챕터 4-6 회고 Klip Klip은 모바일용 블록체인 지갑 서비스이다 👉 카카오톡에 연동되어 메신저만큼 쉬운 사용자 경험을 제공한다 Klip API Klip API는 외부 서비스에서 API를 통해 Klip에 있는 토큰을 전송하거나 NFT 발행 & 조회 & 전송 & 삭제하는 기능을 제공한다 https://docs.klipwallet.com/ (👆 Klip Docs) Klip API를 이용하여 Klip 지갑 연동 (메인넷) -1. Klaytn IDE 에서 간단한 스마트 컨트랙... Read More

🦁 [PROJECT LION] NFT 블록체인 마켓 앱 만들기 with 그라운드X 3기 - 챕터 4-3 회고 KAS ( Klaytn API Service ) Klaytn에서 제공하는 클레이튼 네트워크 전용 API 클레이튼 환경에서 dApp을 개발하려면 클레이튼 네트워크에 엔드포인트(Endpoint Node) 를 띄워야 하는데 KAS를 사용하면 Endpoint Node 역할을 해줘서 따로 노드를 띄울 필요없이 API 로 개발이 가능하다 Caver-js ‘caver-js’ 는 개발자가 HTTP 또는 웹소켓 연결을 사용하여 Klaytn 노드와 상호작용할 수 있도록하는 자바스크립트... Read More

🎉[BEB 4기] 수료 후기 / 23주차 후기 / 회고 🔎 잡서칭( Job Searching ) 이번 주는 자기소개서, 이력서, 면접 클리닉 등 취업에 관련한 여러 가지 훈련들을 진행했다 그리고 블록체인 이론, CS 지식 등 전체적으로 학습 정리 & 마무리를 했고 현업 개발자분들도 오셔서 현실적인 조언과 인사이트를 공유해주셨다 취업전선으로 나아가기 위한 잡서칭 기간이었다 ! 🎁 BEB 로 부터 얻어 가는것 바라보는 시야의 성장 🔎 우리가 흔히 보는 웹페이지와 어플을 보면 ‘이 기능은 어떻게 구현했을까?’, ‘이렇게 하면 이런 걸 만들 수 있지 않을까?’ 라는 생각을 하게... Read More

🦁 [PROJECT LION] NFT 블록체인 마켓 앱 만들기 with 그라운드X 3기 - 챕터 3-9 회고 -1. 카이카스(Kaikas) 지갑에 두개의 계정을 준비합니다. 바오밥(Baobab) 테스트넷 👆 -2. 두개의 계정을 연결 후 솔리디티 코드를 입력하고 배포(Deploy) 👉 전체 코드는 하단에 있습니다 -3. 배포하고 나온 mintWithTokenURI 함수로 토큰 발행 (mint) function mintWithTokenURI (address to, uint256 tokenId, string memory tokenURI) public return... Read More

CSS를 사용하지 않고 중간부분 말줄임 표시하기 Kaikas 지갑을 연결하고 연결된 주소를 출력하고자 합니다 제가 원하는 구현은 지갑주소의 중간부분 말줄임 ( … ) 표시 입니다 👉 (지갑주소 총 42 글자) CSS를 사용하여 구현을 해보려 했는데 👆 CSS 로는 ‘끝부분만’ 말줄임 표시가 되는것 같았습니다 slice 함수를 이용한 코딩작업 그래서 CSS 로는 제가 원하는 구현이 되지 않아 함수를 이용해보기로 했습니다 👆 결과는 성공입니다 ! 중간부분 말줄임 표시를 위해 slice 함수를 이용하여 구현해봤습니다 ! 성공한 코드 (중간부분 말줄임 표시) let st... Read More

NFT로 만들 이미지를 생성 이미지 Props 설정 & 이미지 크기 설정 import React, { FC } from "react"; import { Image } from "@chakra-ui/react"; interface AnimalCardProps { animalType: string; } const AnimalCard: FC<AnimalCardProps> = ({ animalType }) => { // AnimalCardProps을 Props로 받는다 // animalType은 어떤 NFT를 뽑았는지 조회 return ( <Image w={... Read More