メインコンテンツまでスキップ

lesson-1_DEXを操作してみよう

💰 DEX を操作してみよう

これまで実装してきた機能を、ブラウザから操作してみましょう。以下の手順で行います。

  1. トークンをDEXに入金する
  2. オーダーを作成する
  3. 別のユーザーがオーダーを購入する
  4. DEXからトークンを出金する

ユーザーが2名登場するので、最初にTGLDを入金するユーザーをユーザー GLDTSLVを入金するユーザーをユーザー SLVと表記しています。

1. トークンを DEX に入金する

まずは、ユーザーボード上のFaucetボタンを押してトークンTGLDを取得してみましょう。

[ユーザー GLD]

次に、Depositボタンを押して取得したトークンをDEXに入金します。

2. オーダーを作成する

オーダーを作成しましょう。フォームに入力後、Submit Orderボタンを押します。ここでは、"TGLD : 100をTSLV : 100に交換したい" というオーダーを作成しています。

[ユーザー GLD]

3. 別のユーザーがオーダーを購入する

今度は、別のユーザー(ユーザー SLV)でログインをしてみます。もう1つブラウザを開き、Login Internet Identityボタンを押して、新しいアンカーを作成しましょう。

左:[ユーザー GLD]

右:[ユーザー SLV]

認証後、トークンTSLVをFaucetから取得します。残高が更新されたら、トークンTSLVをDEXに入金します。

入金されたら、画像右(ユーザー SLV)のオーダー一覧に表示されているBuyボタンを押してオーダーを購入してみましょう。実行後、オーダーが消えてユーザーボードのトークン量が更新されたことを確認しましょう。

今度は、オーダーが購入された画像左(ユーザー GLD)の残高が更新されているかを確認してみます。ユーザーボードを更新するために、画面のリロードを行いましょう。オーダーを購入したユーザーと同じPrincipalが表示されてしまうので、再度ログインをし直します。アンカーを入力して、Authorizeボタンを押します。

再ログイン後、ユーザーボードを確認してトークン量が更新されていることを確認しましょう。

4. DEX からトークンを出金する

最後に、ユーザー GLDを操作して出金機能を確認します。今回は引き出すトークン量を500に設定しているのでまずは、Depositボタンを押してDEX内の残高を500以上にします。

[ユーザー GLD]

Withdrawボタンを押して、出金を行いトークンが移動したことを確認しましょう。

DEXを操作して、ユーザー間でトークンを取引することができました!

しかし、このままでは未完成なDEXになってしまいます。バックエンド側のコードを編集・再デプロイをした時にある問題が生じてしまいます。それは、再度デプロイをした際にデータがすべてリセットされてしまうことです。オーダーはもちろんのことユーザーがDEXに預けたトークンの残高が失われてしまいます。

次のレッスンでは、この問題を解決するための機能を実装していきます!

🙋‍♂️ 質問する

ここまでの作業で何かわからないことがある場合は、Discordの#icpで質問をしてください。

ヘルプをするときのフローが円滑になるので、エラーレポートには下記の4点を記載してください ✨

1. 質問が関連しているセクション番号とレッスン番号
2. 何をしようとしていたか
3. エラー文をコピー&ペースト
4. エラー画面のスクリーンショット

次のレッスンに進んで、大切なデータを永続化する機能を実装しましょう!