A powerful react hook - useSyncExternalStore

It is an interesting hook called useSyncExternalStore came from React 18. After I went through the doc, I had totally no idea about how to use it and why it works. Luckily, I got a task I thought I can use this hook, and meanwhile I traced the source code to understand useSyncExternalStore implementation. In this article, I will explain how it works internally and show a demo which is differ from the doc.

Read More  

How to use React hook - useImperativeHandle

Today, We’re going to introduce the way to use a great and useful React hook - useImperativeHandle. Have you ever think what is meaning of Imperative?

Imperative
In grammar, a clause that is in the imperative, or in the imperative mood, contains the base form of a verb and usually has no subject. Examples are ‘ Go away’ and ‘ Please be careful’. Clauses of this kind are typically used to tell someone to do something.

So we can just think useImperativeHandle is Let ref access the handle. Go back to useImperativeHandle definition:

useImperativeHandle is a React Hook that lets you customize the handle exposed as a ref.

Right? Okay, before starting it, we have to recap how we do if we don’t use it.

Read More  

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