Blockchain fullstack structure - Part 4 - React.js and Next.js

Alright, the series of articles goes to frontend part. I post an article related to Blockchain with React.js and Next.js. If you haven’t seen my previous posts Part 1 Introduction, Part 2 Hardhat, and Part 3 Golang Gin, please read them first.

In this article, I demonstrate how to use React.js (Next.js) to interact with smart contract by Golang Gin API and hardhat RPC URL, and implement a simple Sign-in with Ethereum (SIWE) authentication and setGreeting to Solidity.

Okay, let’s start it.

Read More  

Blockchain fullstack structure - Part 3 - Golang Gin

It’s time to Blockchain with Golang. If you haven’t seen my previous post Part 1 Introduction and Part 2 Hardhat, please read them first.

Again, does Dapp need a Backend?

reddit

  • You can pretty much make a dapp without backend, but there are some things that can’t be done with a smart contract.
  • You need a backend among other reasons for off-chain or metadata that won’t be stored in the smart contracts.

Have you ever thought about how Moralis works?

Off-chain: Backend infrastructure that collects data from the blockchain, offers an API to clients like web apps and mobile apps, indexes the blockchain, provides real-time alerts, coordinates events that are happening on different chains, handles the user life-cycle and so much more.
Moralis Dapp is used in order to speed up the implementation of the off-chain infrastructure. Moralis Dapp is a bundled solution of all the features most Dapps need in order to get going as soon as possible.

Read More  

Blockchain fullstack structure - Part 1 - Introduction

Recently, I ogranized a template of my blockchain fullstack project, including a Hardhat Solidity, Golang backend, and React js frontend. Does it need golang backend? Actually, I’m not sure. But there is a post said:

Server:
Even though you have your smart contracts as backend, often times a Dapp will still have an additional traditional server running. Not always, but probably more often than you think.

So, I combined Harhat, Golang gin, and Next.js to my dApp-structure github repo, added some basic, simple interaction from Next.js to Blockchain, and from Golang to Blockchain.

Read More  

Hardhat - Solidity and NFT - Part 2 - Deploy contract and Mint NFT

我們上一篇已經設定好docker及hardhat專案,這一篇就從NFT開始。

Generate NFT metadata

先建立一個images資料夾後,把你想要的圖片放進去,並存成1, 2, 3….之類的檔名,然後用ipfs-car指令打包在一起。

找不到圖可以先用opensea doc裡的圖當練習

ipfs-car

接著到NFT Storage上傳images.car檔案就可以了。
image-car-upload

Read More  

Hardhat - Solidity and NFT - Part 1 - Prepare project

農曆年前結束了一個博弈業的案子,開啟了虛擬貨幣及區塊鏈的契機。年後,整個2月都在研究區塊鏈的各種應用,NFT、opensea、solidity、hardhat、ipfs、testnet,今天這篇文章來記錄一下我用Solidity / Hardhat上架NFT的過程,以免以後金魚腦忘光。

Prerequisite: Sign-up these services.

Init project

我是使用docker, docker-compose,所以先來看看我的初始專案架構及docker-compose.ymlDockerfile
Init project

docker-compose.yml

1
2
3
4
5
6
7
8
9
10
11
12
version: '3'

services:
hardhat:
build:
context: ./hardhat
dockerfile: Dockerfile.dev
volumes:
- ./hardhat:/app
- /app/node_modules
ports:
- 8545:8545

Read More