emekaorji

import { Dispatch, SetStateAction, useEffect, useRef, useState } from 'react';

function useStoreState<T>(
  _key: string,
  _initialValue: T | (() => T)
): [T, Dispatch<SetStateAction<T>>];
function useStoreState<T = undefined>(
  _key: string
): [T | undefined, Dispatch<SetStateAction<T | undefined>>];

emekaorji

{
  "compilerOptions": {
    "target": "ES2020",
    "useDefineForClassFields": true,
    "lib": ["ES2020", "DOM", "DOM.Iterable"],
    "module": "ESNext",
    "skipLibCheck": true,

    /* Bundler mode */
    "moduleResolution": "bundler",

emekaorji

git remote add all <remote-url-1>
git remote set-url --add --push all <remote-url-1>
git remote set-url --add --push all <remote-url-2>
git push all <branch>

emekaorji

# shellcheck disable=SC2183  # printf string has more %s than arguments ($FMT_RAINBOW expands to multiple arguments)
print_success() {
  printf '%s         %s__      %s           %s        %s       %s     %s__   %s\n'      $FMT_RAINBOW $FMT_RESET
  printf '%s  ____  %s/ /_    %s ____ ___  %s__  __  %s ____  %s_____%s/ /_  %s\n'      $FMT_RAINBOW $FMT_RESET
  printf '%s / __ \\%s/ __ \\  %s / __ `__ \\%s/ / / / %s /_  / %s/ ___/%s __ \\ %s\n'  $FMT_RAINBOW $FMT_RESET
  printf '%s/ /_/ /%s / / / %s / / / / / /%s /_/ / %s   / /_%s(__  )%s / / / %s\n'      $FMT_RAINBOW $FMT_RESET
  printf '%s\\____/%s_/ /_/ %s /_/ /_/ /_/%s\\__, / %s   /___/%s____/%s_/ /_/  %s\n'    $FMT_RAINBOW $FMT_RESET
  printf '%s    %s        %s           %s /____/ %s       %s     %s          %s....is now installed!%s\n' $FMT_RAINBOW $FMT_GREEN $FMT_RESET
  printf '\n'
  printf '\n'

emekaorji

Connect to wallet using web3js

There is a lot of confusion out there as to how to connect to a web3 browser using web3js, this gist shows how to connect using the most recent (2023) API updates and also providing backwards compatibilty for legacy web3 browsers.

Using JavaScript

Take a look at connect.js below

Using TypeScript

Take a look at connect.ts and global.d.ts for window.ethereum and window.web3 type definitions

emekaorji

Understanding the internet (Resources)

Articles

• Reference Guide
• Popular Terms
• Deep Dive

Videos

• 5 Minutes of the internet
• How Data is transferred over the internet

emekaorji

import { useCallback, useEffect, useState } from 'react';

function testImageUrl(url: string): Promise<string> {
	return new Promise(function (resolve, reject) {
		var image = new Image();
		image.src = url;
		image.addEventListener('load', () => resolve(url));
		image.addEventListener('error', reject);
	});
}

emekaorji

import { useState, useEffect, Dispatch, SetStateAction } from 'react';

function useLocalStorage<T>(
	_key: string,
	_initialValue: T | (() => T)
): [T, Dispatch<SetStateAction<T>>];
function useLocalStorage<T = undefined>(
	_key: string
): [T | undefined, Dispatch<SetStateAction<T | undefined>>];

emekaorji

{
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "esModuleInterop": true,

emekaorji

"@types/node": "18.15.5",
        "@types/react": "18.0.28",
        "@types/react-dom": "18.0.11",
        "eslint": "8.36.0",
        "eslint-config-next": "13.2.4",
        "next": "13.2.4",
        "react": "18.2.0",
        "react-dom": "18.2.0",
        "typescript": "5.0.2"