telegramTelegram Mini Apps

How to create a Web3 Game from scratch and add it to Telegram Mini Apps

Before we add our Web3 game to Telegram Mini Apps you can create a Web3 game in 1 minute.

  1. You need to go to BotFatherarrow-up-right to create a bot and app in Telegram.

  1. Create New Bot

To start you need to press the Start button or send:

To create a new bot you need to send:

Give your bot a name and send it to chat:

Now we need to give username to the bot so it ends in “bot” and send:

Your bot has been created. Now you can move on to creating the app.

  1. Create New App

To create a new web app you need to send:

The app binds to a specific bot, you need to send its name with an @ sign:

Next, enter the name of the web application:

After that, you need to enter a short description:

Next, you need to send a picture of your app with a strict resolution of 640×360 pixels.

After that you need to upload the GIF or send it:

Now we need to paste the link to the game we got here, you need to copy the link belonging to the yellow “Play Now Web Application” button, which is in Dashboard

Now please choose a short name for your web app: 3-30 characters, a-zA-Z0-9_. This short name will be used in URLs like t.me/MyTgGame_bot/myapp and serve as a unique identifier for your web app.

circle-check
  1. Server settings

Now we need to get a Bot Token:

Select your bot by clicking on the bot name and click API Token.

The obtained API token should be inserted into your Title Settingsarrow-up-right. To do this, go to Settings -> Integrations in the menu.

In the Telegram section there is a field “Telegram Bot Token”, there you need to insert your API token obtained from @BotFather and click “Save Settings” button.

After successfully saving the settings, click on the “Register Telegram Webhook” button.

And in “Platform Settings” under “Telegram Mini Apps”, change the “Referral App Link” field to the link of your Telegram game. This is necessary for the referral link to work correctly in your Telegram Mini App.

circle-check

Last updated