Skip to main content

VercelにWEBサイトをデプロイしよう

🚀 Vercel で Web アプリケーションをデプロイする​

作成したWebアプリケーションをデプロイしてみましょう。

ここでは Vercel を用いてデプロイします。

Vercelのアカウントをお持ちでない方は、上記のリンクにアクセスして、アカウントを作成してください。

デプロイ方法を簡単に説明します。

1 . 最新のコードをGitHubにプッシュします。

2 . Vercelのダッシュボードから、Add New...をクリックし、Projectを選択します。

3 . WebアプリケーションのリポジトリをImportしてください。

4 . 必要項目を埋めていきます。FRAMEWORK PRESET ではNext.jsを選択してください。

5 . Environment Variables には環境変数としてCI=falseを登録してください。

環境変数CI = falseを追加することにより、警告が原因でビルドが失敗しないようになります。

6 . デプロイします!

7 . デプロイが完了し、ローカルと同じ動作が確認できれば成功です!おめでとうございます 🥭

🎫 NFT を取得しよう​

NFTを取得する条件は、以下のようになります。

  1. MVPの機能がすべて実装されている（実装OK）

  2. WebアプリケーションでMVPの機能が問題なく実行される（テストOK）

  3. このページの最後にリンクされているProject Completion Formに記入する

  4. Discordの🔥｜completed-projectsチャンネルに、あなたのWebサイトをシェアしてください 😉🎉 。Discordへ投稿する際に、追加実装した機能とその概要も教えていただけると幸いです!

プロジェクトを完成させていただいた方には、NFTをお送りします。※ 現在準備中ですので、今しばらくお待ちください!

😍 完成​

これにて本プロジェクトは終了です。

もし余力があれば、以下のような実装にもチャレンジしてみましょう!

  • ニーモニックフレーズを簡単にコピーできる機能
  • ニーモニックフレーズの初期表示を非表示にする機能
  • ウォレットインポートのフォームにおけるバリデーション
  • ネットワークをdevnet以外に変更できる機能
  • エアドロップするSOLの値を変更できる機能
  • 各アクションにおけるローディングやエラーメッセージの表示

など、イケている機能を実装できたらDiscordでコミュニティに紹介してみてください!

🙋‍♂️ 質問する​

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

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

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

Project Completion Formはこちらです。