Sign Up
Skip to content

Build a Telegram Mini-Game in Unity

This guide will walk you through setting up your Telegram Mini-app or game using Sequence's Unity SDK, enabling web3 functionality on EVM chains for your users, for email and guest authentication methods.

We’ll develop the game logic in Unity, but to deploy it as a Telegram Mini-Game, we’ll package the WebGL build within a React project.

Setup your Telegram Bot

Create a Telegram Bot with BotFather

  1. Open Telegram and search for "@BotFather"
  2. Start a conversation by clicking "Start" or typing /start
  3. Create a new bot by typing /newbot
  4. Follow the prompts:
  • Enter a name for your bot
  • Choose a username (must end in 'bot')

Obtain Required Tokens

After creating your bot, BotFather will provide:

  • Bot Token (HTTP API Token)
  • Bot Username

Save these credentials - you'll need them for the next steps.

Prepare your Unity WebGL Project

Install Sequence's Unity SDK

Use one of our recommend installation options for your existing project or use our Unity Boilerplate if you want to start a project from scratch.

UI for Mobile Layouts

Ensure that your game's UI is optimized for mobile aspect ratios. We recommend using the Device Simulator for Unity. Additionally, ensure your input handling is set up for touch controls.

Configure Sequence's React Template for WebGL

Sequence's Unity SDK includes a WebGL Template for exporting as a React project. Copy the WebGLTemplates folder from Packages/Sequence Embedded Wallet SDK/ into your project's Assets/ directory. Go to Project Settings -> Player -> WebGL -> Resolution and Presentation and select the SequenceReact template.

Cloudflare Configuration

Inside the React project's root directory, create a wrangler.toml file and include the following content.

name = "telegrambot"
compatibility_date = "2024-03-25"
pages_build_output_dir = "./dist"
[vars]
BOT_TOKEN = "GET_YOUR_BOT_TOKEN_FROM_BOTFATHER"
BOT_SECRET = "can_be_any_long_random_string_abc123_do_not_share"
 
[dev]
port = 4444

Build your WebGL game as a React project

Open the root directory of your React project in a CLI or an IDE like Visual Studio Code, and run the following command to test your game in the browser.

pnpm install
pnpm run dev

Deploy your Telegram Mini-Game

Authenticate with Cloudflare Account

From the React project's root directory, deploy the app and functions logic to Cloudflare.

  1. Run pnpm wrangler pages deploy

This will prompt you to authenticate with Cloudflare if not already logged in. On successful deploy, copy the URL where your application is now hosted.

Register Webhook with Telegram

Now we call our registerWebhook endpoint on our app to register the webhook function with the URL of your deployed application to enable access for the Telegram API.

curl -X POST \
     "<YOUR_CLOUDFLARE_DEPLOYED_URL>/api/registerWebhook"

Update Allowed Origins

Ensure in Sequence Builder that your wallet configuration includes the URL of your deployed application as an allowed origin.

Test out your Telegram Game!

Send a message to your bot on Telegram and check if it responds! It should answer you with the ability to share, play or get more information about the bot.