（動画付き）[Astar]コントラクト備忘録32（Polkadot.jsを使ってAPIインスタンスを作成する）

本日は、Polkadot.jsを用いて、APIインスタンスを作成していきたいと思います。

この記事に対応するYouTubeはこちらです。
https://www.youtube.com/watch?v=xvrDJ0ygVjA

1 next.jsでサンプルプロジェクトを作成する

まずは、next.jsでサンプルプロジェクトを作ってみましょう。

npx create-next-app@latest wasm-test1 --typescript

下のように、作成できました。

できたディレクトリに行き、「yarn dev」を実行します。

このように、うまく立ち上がりました。（私は、3000が使用中だったようで、3001が立ち上がっています。）

2 main関数を作成する

では、次に、簡単なmain関数を作っていきます。

非同期処理を行いますので、「async」で囲んでいます。

async function main () { 

}
main().then(() => console.log('completed'))

下ように設定しました。

右クリックの「検証」から「コンソール」を見てみると、下のように反応していることが確認できました。

3 プロバイダからAPIインスタンスを作成する

では、実際の中身に進んでいきましょう。

こちらのPolkadot.jsのページから確認していきます。

https://polkadot.js.org/docs/api/start/create

下のように、コードを貼り付けます。

// Import
import { ApiPromise, WsProvider } from '@polkadot/api';

...
// Construct
const wsProvider = new WsProvider('wss://rpc.polkadot.io');
const api = await ApiPromise.create({ provider: wsProvider });

// Do something
console.log(api.genesisHash.toHex());

下のように、@polkadot/apiをインストールしましょう。

すると、下のように、apiの取得が確認できました！

今回は以上です。