見出し画像

MoralisでNFTゲームを構築する方法|フロントエンド/バックエンド

この記事は「NFT Game Development — How to Build an NFT Game App in Minutes」を日本語翻訳したものです。

すぐに作業を開始したい場合は、UnitySDKの完全なボイラープレートを確認してください。次の記事では、NFTゲームの開発を段階的に説明します。ただし、すぐに手を汚そうとしている開発者は、必ずこのGitHubをチェックしてください。

NFTゲーム開発用のEthereum Unityボイラープレート

アプリケーションの作成に関しては、ゲームの開発に比較的負担がかかる可能性があります。さらに難しい作業は、分散型Web用のゲームを開発することです。これは、Web3開発ドメインに基本的な開発ツールが不足しているためです。ただし、適切なツールボックスがあれば、ゲーム開発はそれほど難しくなくてもかまいません。Web3開発の場合、最適なツールはMoralisです。画期的なWeb3ゲームの作成に興味がある場合は、NFTゲーム開発を詳しく見て、Moralisを使用してわずか数分でゲームアプリケーションを構築する方法を紹介します。

Moralisは、分散型Web用のdApp(分散型アプリケーション)を開発するためのナンバーワンのミドルウェアです。Moralisプラットフォームが提供する有能な開発ツールを使用すると、開発時間を大幅に短縮できます。何よりも、これはNFTゲームだけでなく、dApp開発全般にも当てはまります。

このプラットフォームは、ユーザーに無限にスケーラブルなバックエンドインフラストラクチャを提供し、ユーザーがアプリケーションのフロントエンドに集中できるようにします。このように、モラリスへのバックエンドの開発の重労働をオフロードすることが可能です。

プラットフォームはまた、貴重なツールを提供することにより、開発プロセスを容易にします。その中には、Speedy NodesMoralis NFT APIMoralisPriceAPIなどがあります。このように、MoralisはdAppおよびNFTゲーム開発のための究極のプラットフォームです。

したがって、NFTゲーム開発者になりたい場合、最初のステップはMoralisに参加することです。

MoralisでNFTゲームを構築する方法—フロントエンド

このセクションでは、Moralisを使用することの力を紹介するために、独自のNFTゲームを作成する方法を詳しく見ていきます。約100行のコードで、アバターが2D環境で動き回ることができるトークンで表される完全に機能するNFTゲームを作成できます。この例では、AavegotchiNFTを使用します。ただし、ロジックは他のNFTでも同じです。つまり、Aavegotchisに限定されません。

NFTゲーム開発プロセスの素晴らしいスタートは、これから作成するゲームのセキュリティを説明することです。NFTゲームは実際の賞品に報いることがあるため、セキュリティは非常に重要な懸念事項です。そのため、不正行為は禁止されており、アプリケーションがこれを防止するようにする必要があります。

不正行為の可能性のないゲーム環境を確保するために、ほとんどのゲームロジックをバックエンドコードに配置します。そのため、フロントエンドの主なタスクは、アバターをある方向に移動することが有効かどうかをサーバーに確認することです。これは、ユーザーがアプリケーションをハッキングしたり、ゲーム内で不正行為をしたりするのを防ぐことができることを意味します。

では、100行のコードでこれをすべて可能にするにはどうすればよいでしょうか。さて、簡単な答えはモラリスです。

MoralisによるNFTゲーム開発

より迅速で簡単なWeb3開発プロセスを可能にするには、適切なツールが必要です。Web3の究極の開発プラットフォームはMoralisです。Moralisを使用すると、NFTゲームを簡単に作成でき、開発プロセスが大幅に短縮されます。Moralisは、すべてのdAppの基本ロジックをすでに理解しており、プラットフォームユーザーとして、そのすべての機能にアクセスできます。

NFTゲームの2つの非常に重要な機能は、リアルタイムアラートとNFTバランスをチェックする機能です。これらのMoralisツールを使用して、ブロックチェーンからリアルタイムデータを取得し、ユーザーがNFTを所有しているかどうかを確認します。

さらに、Moralisは、dApp開発全般のための他の優れたツールも提供しています。いくつかの例は、IPFSのネイティブサポート、クロスチェーン互換性、および開発者としての優れたサポートです。Moralisブログには、Moralisユーザーとして何が可能かを確認し、さらに深く理解するための優れたガイドも掲載されています 。

NFTゲームを開発するときにMoralisを使用するので、最初のステップはMoralisにすぐにサインアップすることです。

NFTゲーム開発のためのMoralisのセットアップ

ゲーム自体のコードを作成する前に、Moralis SDK(ソフトウェア開発キット)をインポートして、Moralisを初期化する必要があります。さらに、Moralisを初期化するには、最初にサーバーを作成する必要があります。

  • Moralisサーバーを作成する—最初に行うことは、Moralisを使用してサーバーをセットアップすることです。Moralisを使用してサーバーを作成するのは簡単で、数分しかかかりません。サーバーを初期化するには、Moralisにログインして、[+ Create anewApp]ボタンをクリックする必要があります。クリックすると、ドロップダウンメニューが表示され、3つの選択肢があります。どのオプションを選択するかは問題ではありませんが、この例では、テストネットをお勧めします。起動するサーバーの種類を選択したら、サーバーに名前を付け、地域を選択してから、ネットワークを選択する必要があります。選択が完了したら、[インスタンスの追加]ボタンを押すだけでサーバーを起動できます。サーバーの稼働には数分かかる場合がありますが、まもなく稼働します。

  • Moralis SDK —数行のコードでMoralisSDKを簡単にインポートできます。そうする理由は、プログラミング時にライブラリやその他の貴重なツールにアクセスするために、コード内の開発キットにアクセスできるようにするためです。SDKのインポートは次のようになります。

  • Moralisの初期化—最後に、Moralisも初期化する必要があります。このためには、サーバーのURLとアプリケーションIDを見つける必要があります。これは、問題のサーバーの[詳細の表示]ボタンをクリックして見つけることができます。この場合、コードはアプリIDとサーバーURLで次のようになります。

ユーザーの認証

私たちのゲームのプレーヤーがウェブサイトにアクセスするとき、私たちは彼らがログインして自分自身を認証できるようにする必要があります。この認証はMetaMaskを介して行われます。この拡張機能に慣れていない場合は、このMetamaskの内訳を確認してください。これは非常に簡単で、必要なのは1行のコードだけです。

さらに、この機能を優れたものにしているのは、Moralisの統合です。ユーザーがログインし、コード行が実行されると、新しいユーザーがMoralisデータベースに追加されます。問題のサーバーの3つのドットをクリックし、[ダッシュボード]を押すと、サーバーのデータベース内のすべてのユーザーを表示できます。

ダッシュボードインターフェイスの左端には、[ブラウザ]、[Webhook]、[ジョブ]などのさまざまなタブが表示されます。[ブラウザ]タブの下には、いくつかの異なるページがあります。例として、すべてのユーザーの暗号アドレスが表示される「ユーザー」ページがあります。

ただし、このチュートリアルでさらに重要なのは、「EthNFTOwners」ページでユーザーのすべてのNFTを確認できることです。これは非常に驚くべきことで、コードは1行だけで、ユーザーの暗号アドレスからNFTまですべてを表示できます。

これはMoralisの魔法を示しており、約100行のコードでNFTゲームを作成できる多くの理由の1つにすぎません。さらに、これは、Moralisが暗号dAppの開発プロセスを加速するのにどのように役立つかを示しています。これは業界全体に利益をもたらします。

NFTゲームグラフィックス

ゲーム開発プロセスの次のステップは、ゲームのグラフィックを設定することです。この例では、無料で高速なオープンソースのHTML5ゲームライブラリであるPhaserというライブラリを使用します。これは、NFTゲームで使用するような単純な描画を作成するための優れたライブラリです。したがって、Phaserゲームライブラリを初期化するためのコードの例は次のようになります。

さらに、グラフィックがどのように見えるかを示すために、実際のゲームの画面を次に示します。

NFTゲームのライフサイクル

次は、ゲームのライフサイクルです。これはすべてのゲームが持っているものであり、ゲームがたくさんのものをロードすることから始まります。したがって、ここでの例は、ゲームの背景をロードする「プリロード」と呼ばれる関数を使用できることです。

ご覧のとおり、ゲームの背景のみをプリロードしていますが、上の画面にはいくつかのアバターがあります。ただし、アバターはプレーヤーに属しているため、プリロードすることはできません。

また、どのプレーヤーがすぐにプレイしているかはわかりません。そのため、画面に表示するアバターがわかりません。アバターに関するデータはブロックチェーンからフェッチされ、アプリケーションの別の部分にロードされます。

さらに、コードでわかるように、「ping()」関数も実行します。サーバーへのpingを開始する必要があるため、これは重要です。これは、サーバーが現時点でどのプレーヤーがゲームをプレイしているかを認識する必要があるためです。このping機能は毎秒継続的に繰り返されます。関数は次のようになります。

コントロールとサブスクリプション

ゲームのグラフィックスの関数を作成したら、コントロールを追加して、GameStateへのサブスクリプションを設定できます。しかし、これはどういう意味ですか?

Moralisのサーバーデータベースを見ると、「GameState」というタブがあります。GameStateは、マップ上のすべてのプレーヤー/アバターがどこにあるかを教えてくれます。

これは、GameStateで何かが変更されるとすぐに、サブスクリプションがすべてのクライアントを更新することを意味します。そのため、他のプレイヤーが世界を移動するたびにアラートを受け取ります。

Moralisを使用すると、WebSocket、WebSocketに接続するロジック、データの送信などを使用して複雑なインフラストラクチャを構築する際の煩わしさをすべて回避できます。

プラットフォームを利用するだけです。必要なのは、上記のサブスクリプションコードを実装することだけです。これは、ゲームがマップ上のすべてのプレーヤーのステートを確実に認識できるようにするために必要なのは、数行のコードだけであることを意味します。

更新機能

GameStateのサブスクリプションを設定し、ゲームのコントロールを確立したら、更新機能も必要になります。この関数は、押されたキーをリッスンしてから、キャラクターをサーバーに移動する要求を送信します。更新関数の一部は次のようになります。これは、アバターを上方向に移動するためのリクエストです。

ただし、このスニペットからの重要なポイントは、ゲーム内でキャラクターを即座に動かしていないことです。サーバーにリクエストを送信するだけです。そうする理由は、サーバーがキャラクターをその方向に動かすことが可能かどうかを判断するためです。そのため、実際にゲームをプレイせずにキャラクターを動かすことは不可能であり、サーバーはユーザーの不正行為を禁止しています。

ステートを描く

最後に、ゲームのステートを描画する機能があります。「drawState」関数の最初の部分は、新しいプレーヤーに関するものです。プレーヤーが不明な場合、関数はMoralisサーバーからプレーヤーSVGをフェッチし、ブロックチェーンから直接取得します。ただし、NFTゲームのバックエンドコードを確認するときに、SVGがどのようにフェッチされるかについてもう少し詳しく説明します。

新規プレイヤーでない場合、ゲームはプレイヤーのアバターをゲーム環境内で移動させるだけです。この例のコードは次のようになります。

したがって、要約すると、プレーヤーが2D環境で動き回れるようにするために実装する必要があるのは、ほんの一握りの関数だけです。さらに、コードはGameStateにサブスクライブして、ゲーム内の他のすべてのプレーヤーのリアルタイム更新をクライアントに提供する必要があります。これは、数行のコードで実現しました。

これはすべてフロントエンド向けであり、NFTゲーム開発プロセスはプログラミングとJavaScriptの基本的な知識があれば非常に簡単です。これがMoralisの力であり、興味があれば、Moralis.ioはETHdAppとPolygondAppの作成に関する優れたガイドも提供します。ただし、アプリケーションのバックエンドを開発する必要があるため、完全には完了していません。

NFTゲームを構築する方法–バックエンド

アプリケーションのフロントエンドの開発が簡単な場合は、Moralisのおかげで、バックエンドはさらに簡単になります。NFTゲームのバックエンドには、ゲームロジックの詳細と、誰かがゲームをプレイしているときにフロントエンドが呼び出す一連の関数があります。ここでの最初の例は、アバターを移動するための関数です。

移動機能

プレーヤーがキーボードのキーを押してアバターを移動しようとすると、フロントエンドはこの移動関数を呼び出します。この関数は、アバターが移動する方向を受け取り、アプリケーションのステートを更新します。

ご覧のとおり、move関数は「updateState」関数も呼び出します。この関数はアバターを移動します。この例では、ユーザーが好きな方向に5ユニット移動します。

ただし、ご覧のとおり、ここにさらにロジックを追加できることを説明するコメントもあります。そのため、アバターが拾うことができるアイテムを追加したり、アバターが移動できない境界/障害物を作成したりできます。サーバーは、プレイヤーの移動方向に何か問題がないか確認し、必要に応じて移動を制限することができます。

永続ステート関数

このゲームのもう1つの関数は、「persistState」関数です。これは、GameStateがサーバーのデータベースに保存される場所です。この関数は次のようになります。

ステートが保存されると、すべてのクライアントが新しいGameStateで更新されます。これにより、クライアントとサーバー間の通信がリアルタイムで機能します。これは、フロントエンドのサブスクリプション機能と組み合わせて10行未満のコードしか必要としない、すっきりとしたシンプルなソリューションです。

ping機能

バックエンドには、ユーザーがサーバーにpingを実行したときにチェックし、これをゲームのステートに保存するping関数もあります。

さらに、この関数を使用して、ブロックチェーンからSVGをフェッチします。ここで最初に行うことは、ユーザーにNFTを照会することです。この情報に基づいて、ブロックチェーンからユーザーのSVGを取得できます。

ご覧のとおり、ping関数コードは「getSVGString」と呼ばれる別の関数を呼び出します。これは、ブロックチェーンからSVGを取得する方法です。一見すると、ABIはかなり充実しているので、この関数はかなり怖いように見えます。ただし、AavegotchiコントラクトからABIをコピーして貼り付けることができます。

それでおしまい; これらはすべて、最初のNFTゲームを作成するために必要な機能です。リアルタイムの更新から、移動が有効かどうかをサーバーに確認する機能まで、すべてを実装しました。それほど複雑ではなく、適切なツールを使用すれば、このゲームを数分で作成できます。


ただし、NFTゲームの開発プロセスについてまだ質問がある場合は、MoralisYouTubeチャンネルの次のビデオを視聴することをお勧めします。このチュートリアルでは、Ivan on Techが完全なプロセスを順を追って説明し、アプリケーションが実際にどのように機能するかをより詳細に説明します。さらに、最後に、Ivanはアプリのユーザーエクスペリエンスを改善する方法についていくつかの提案も提供します。

NFTゲーム開発—まとめ

ゲーム開発は非常に複雑なプロセスと見なされていますが、そうである必要はありません。必要なのは適切なツールだけです。Web3開発の場合、そのツールはMoralisです。

Moralisの魔法を使ってNFTゲームをすばやく簡単に作成できることを紹介しました。シンプルなフロントエンドとバックエンドを備えたAavegotchiゲームを開発しましたが、これには数分しかかかりませんでした。ただし、これは読者にとってプロセスを明確にするための単なる例であり、同じロジックで他のゲームを作成することも可能です。そのため、私たちはAavegotchiにまったく限定されていません。

ただし、プロセスをよりアクセスしやすく、大幅に高速化するには、Moralisが必要です。10行未満のコードでクライアントとサーバー間のリアルタイム通信を作成する機能は、Moralisの力を明確に示しています。プラットフォームの利便性に確信が持てない場合は、Moralisを使用してEthereumトークンBSCトークンを作成するのがいかに簡単かを確認してください。

したがって、NFTゲームの開発に取り掛かろうとしている場合、最初に行う必要があるのは、今日Moralisにサインアップすることです。注目に値するNFTdAppを作成できるだけでなく、Moralisと同じくらい強力なプラットフォームを使用する機会は無限にあります。


この記事が気に入ったらサポートをしてみませんか?