Skip to content

Commit

Permalink
twa -> tma
Browse files Browse the repository at this point in the history
  • Loading branch information
SwiftAdviser committed Sep 21, 2023
1 parent d4c2aa6 commit db893df
Show file tree
Hide file tree
Showing 7 changed files with 28 additions and 28 deletions.
4 changes: 2 additions & 2 deletions docs/develop/dapps/telegram-apps/README.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ Unlock the gateway to an **800 million-strong Telegram audience**. Imagine offer

Telegram bots can completely replace any website. They support seamless authorization, integrated payments via 20 payment providers (with Google Pay and Apple Pay out of the box), delivering tailored push notifications to users, and much more.

With Web Apps, bots get a whole new dimension. Bot developers can create infinitely flexible interfaces with JavaScript, the most widely used programming language in the world.
With Mini Apps, bots get a whole new dimension. Bot developers can create infinitely flexible interfaces with JavaScript, the most widely used programming language in the world.

Here are some key points about Telegram Mini Apps:

Expand Down Expand Up @@ -51,7 +51,7 @@ Join a special Telegram Developers Chat to discuss TWA development and get suppo

<Button href="https://t.me/+1mQMqTopB1FkNjIy" colorType={'primary'} sizeType={'sm'}>Join Chat</Button>

### Web Apps SDKs
### Mini Apps SDKs

- [twa-dev/sdk](https://github.com/twa-dev/sdk) — NPM package for TWA SDK
- [twa-dev/boilerplate](https://github.com/twa-dev/Boilerplate) — another boilerplate for a new TWA.
Expand Down
32 changes: 16 additions & 16 deletions docs/develop/dapps/telegram-apps/publishing.mdx
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
import Button from '@site/src/components/button'


# Publishing Web Apps
# Publishing Mini Apps

As developers, it's important to understand the ecosystem in which we operate. Telegram provides a unique opportunity for Web App developers, thanks to its robust platform and expansive user base. This article will guide you through the available channels for publishing your Web Apps on Telegram.
As developers, it's important to understand the ecosystem in which we operate. Telegram provides a unique opportunity for Web App developers, thanks to its robust platform and expansive user base. This article will guide you through the available channels for publishing your Mini Apps on Telegram.

## tApps Center

**What is tApps Center?** The TON Foundation has introduced the Telegram Apps Center to create a centralized repository for Telegram Bots and Web Apps (TWAs). This platform aims to enhance the user experience by offering an interface similar to the well-known app stores you're already familiar with.
**What is tApps Center?** The TON Foundation has introduced the Telegram Apps Center to create a centralized repository for Telegram Bots and Mini Apps (TMAs). This platform aims to enhance the user experience by offering an interface similar to the well-known app stores you're already familiar with.

**Broad Ecosystem Support**. The Telegram Apps Center doesn't solely focus on the TON ecosystem; it also welcomes apps from other blockchains. You don't even need web3 integration to be part of this catalog. This inclusive approach aims to establish Telegram as an "Everything Super App," similar to platforms like WeChat, where users can access a variety of services within a single interface.

Expand All @@ -23,13 +23,13 @@ As developers, it's important to understand the ecosystem in which we operate. T

## Launch within Telegram

Telegram currently supports six different ways of launching Web Apps: from a [keyboard button](https://core.telegram.org/bots/webapps#keyboard-button-web-apps), from an [inline button](https://core.telegram.org/bots/webapps#inline-button-web-apps), from the [bot menu button](https://core.telegram.org/bots/webapps#launching-web-apps-from-the-menu-button), via [inline mode](https://core.telegram.org/bots/webapps#inline-mode-web-apps), from a [direct link](https://core.telegram.org/bots/webapps#direct-link-web-apps) – and even from the [attachment menu](https://core.telegram.org/bots/webapps#launching-web-apps-from-the-attachment-menu).
Telegram currently supports six different ways of launching Mini Apps: from a [keyboard button](https://core.telegram.org/bots/webapps#keyboard-button-web-apps), from an [inline button](https://core.telegram.org/bots/webapps#inline-button-web-apps), from the [bot menu button](https://core.telegram.org/bots/webapps#launching-web-apps-from-the-menu-button), via [inline mode](https://core.telegram.org/bots/webapps#inline-mode-web-apps), from a [direct link](https://core.telegram.org/bots/webapps#direct-link-web-apps) – and even from the [attachment menu](https://core.telegram.org/bots/webapps#launching-web-apps-from-the-attachment-menu).

![](/img/docs/telegram-apps/publish-tg-1.jpeg)

### Keyboard Button Web Apps
### Keyboard Button Mini Apps

**TL;DR:** Web Apps launched from a **web_app** type [keyboard button](https://core.telegram.org/bots/api#keyboardbutton) can send data back to the bot in a *service message* using [Telegram.WebApp.sendData](https://core.telegram.org/bots/webapps#initializing-web-apps). This makes it possible for the bot to produce a response without communicating with any external servers.
**TL;DR:** Mini Apps launched from a **web_app** type [keyboard button](https://core.telegram.org/bots/api#keyboardbutton) can send data back to the bot in a *service message* using [Telegram.WebApp.sendData](https://core.telegram.org/bots/webapps#initializing-web-apps). This makes it possible for the bot to produce a response without communicating with any external servers.

Users can interact with bots using [custom keyboards](https://core.telegram.org/bots#keyboards), [buttons under bot messages](https://core.telegram.org/bots#inline-keyboards-and-on-the-fly-updating), as well as by sending freeform **text messages** or any of the **attachment types** supported by Telegram: photos and videos, files, locations, contacts and polls. For even more flexibility, bots can utilize the full power of **HTML5** to create user-friendly input interfaces.

Expand All @@ -42,9 +42,9 @@ To transmit data from the user back to the bot, the Web App can call the [Telegr
- **Сustom data input interfaces** (a personalized calendar for selecting dates; selecting data from a list with advanced search options; a randomizer that lets the user “spin a wheel” and chooses one of the available options, etc.)
- **Reusable components** that do not depend on a particular bot.

### Inline Button Web Apps
### Inline Button Mini Apps

**TL;DR:** For more interactive Web Apps like [@DurgerKingBot](https://t.me/durgerkingbot), use a **web_app** type [Inline KeyboardButton](https://core.telegram.org/bots/api#inlinekeyboardbutton), which gets basic user information and can be used to send a message on behalf of the user to the chat with the bot.
**TL;DR:** For more interactive Mini Apps like [@DurgerKingBot](https://t.me/durgerkingbot), use a **web_app** type [Inline KeyboardButton](https://core.telegram.org/bots/api#inlinekeyboardbutton), which gets basic user information and can be used to send a message on behalf of the user to the chat with the bot.

If receiving text data alone is insufficient or you need a more advanced and personalized interface, you can open a Web App using a **web_app** type [Inline KeyboardButton](https://core.telegram.org/bots/api#inlinekeyboardbutton).

Expand All @@ -57,9 +57,9 @@ The bot can call the Bot API method [answerWebAppQuery](https://core.telegram.or
- Fully-fledged web services and integrations of any kind.
- The use cases are effectively **unlimited**.

### Launching Web Apps from the Menu Button
### Launching Mini Apps from the Menu Button

**TL;DR:** Web Apps can be launched from a customized menu button. This simply offers a quicker way to access the app and is otherwise **identical** to [launching a Web App from an inline button](https://core.telegram.org/bots/webapps#inline-button-web-apps).
**TL;DR:** Mini Apps can be launched from a customized menu button. This simply offers a quicker way to access the app and is otherwise **identical** to [launching a Web App from an inline button](https://core.telegram.org/bots/webapps#inline-button-web-apps).

By default, chats with bots always show a convenient **menu button** that provides quick access to all listed [commands](https://core.telegram.org/bots#commands). With [Bot API 6.0](https://core.telegram.org/bots/api-changelog#april-16-2022), this button can be used to **launch a Web App** instead.

Expand All @@ -72,27 +72,27 @@ Apart from this, Web Apps opened via the menu button work in the exact same way

[@DurgerKingBot](https://t.me/durgerkingbot) allows launching its Web App both from an inline button and from the menu button.

### Inline Mode Web Apps
### Inline Mode Mini Apps

**TL;DR:** Web Apps launched via **web_app** type [InlineQueryResultsButton](https://core.telegram.org/bots/api#inlinequeryresultsbutton) can be used anywhere in inline mode. Users can create content in a web interface and then seamlessly send it to the current chat via inline mode.
**TL;DR:** Mini Apps launched via **web_app** type [InlineQueryResultsButton](https://core.telegram.org/bots/api#inlinequeryresultsbutton) can be used anywhere in inline mode. Users can create content in a web interface and then seamlessly send it to the current chat via inline mode.

NEW You can use the *button* parameter in the [answerInlineQuery](https://core.telegram.org/bots/api#answerinlinequery) method to display a special 'Switch to Web App' button either above or in place of the inline results. This button will **open a Web App** from the specified URL. Once done, you can call the [Telegram.WebApp.switchInlineQuery](https://core.telegram.org/bots/webapps#initializing-web-apps) method to send the user back to inline mode.

Inline Web Apps have **no access** to the chat – they can't read messages or send new ones on behalf of the user. To send messages, the user must be redirected to **inline mode** and actively pick a result.
Inline Mini Apps have **no access** to the chat – they can't read messages or send new ones on behalf of the user. To send messages, the user must be redirected to **inline mode** and actively pick a result.

**Good for:**

- Fully-fledged web services and integrations in inline mode.

### Direct Link Web Apps
### Direct Link Mini Apps

**TL;DR:** Web App Bots can be launched from a direct link in any chat. They support a *startapp* parameter and are aware of the current chat context.

NEW You can use direct links to **open a Web App** directly in the current chat. If a non-empty *startapp* parameter is included in the link, it will be passed to the Web App in the *start_param* field and in the GET parameter *tgWebAppStartParam*.

In this mode, Web Apps can use the *chat_type* and *chat_instance* parameters to keep track of the current chat context. This introduces support for **concurrent** and **shared** usage by multiple chat members – to create live whiteboards, group orders, multiplayer games and similar apps.
In this mode, Mini Apps can use the *chat_type* and *chat_instance* parameters to keep track of the current chat context. This introduces support for **concurrent** and **shared** usage by multiple chat members – to create live whiteboards, group orders, multiplayer games and similar apps.

Web Apps opened from a direct link have **no access** to the chat – they can't read messages or send new ones on behalf of the user. To send messages, the user must be redirected to **inline mode** and actively pick a result.
Mini Apps opened from a direct link have **no access** to the chat – they can't read messages or send new ones on behalf of the user. To send messages, the user must be redirected to **inline mode** and actively pick a result.

**Examples**

Expand Down
2 changes: 1 addition & 1 deletion docs/develop/dapps/telegram-apps/step-by-step-guide.mdx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Step-By-Step Guide

Telegram Mini Apps are web applications that run inside the Telegram messenger. They are built using web technologies — HTML, CSS, and JavaScript. Telegram Web Apps can be used to create DApps, games, and other types of apps that can be run inside Telegram.
Telegram Mini Apps are web applications that run inside the Telegram messenger. They are built using web technologies — HTML, CSS, and JavaScript. Telegram Mini Apps can be used to create DApps, games, and other types of apps that can be run inside Telegram.

## Create your App

Expand Down
8 changes: 4 additions & 4 deletions docs/develop/dapps/telegram-apps/testing-apps.mdx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import ConceptImage from '@site/src/components/conceptImage'

# Testing Web Apps
# Testing Mini Apps

## Using bots in the test environment

Expand All @@ -18,9 +18,9 @@ After receiving your bot token, you can send requests to the Bot API in this for

**Note:** When working with the test environment, you may use HTTP links without TLS to test your Web App.

## Debug Mode for Web Apps
## Debug Mode for Mini Apps

Use these tools to find app-specific issues in your Web App:
Use these tools to find app-specific issues in your Mini App:

### Android

Expand All @@ -38,7 +38,7 @@ Use these tools to find app-specific issues in your Web App:
### Telegram macOS

- Download and launch the [Beta Version](https://telegram.org/dl/macos/beta) of Telegram macOS.
- Quickly click 5 times on the Settings icon to open the debug menu and enable “Debug Web Apps”.
- Quickly click 5 times on the Settings icon to open the debug menu and enable “Debug Mini Apps”.

Right click in the web app and choose *Inspect Element*.

Expand Down
4 changes: 2 additions & 2 deletions docs/develop/dapps/ton-connect/overview.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,10 @@ Experience seamless connectivity with wallets within [TON](/learn/introduction)

Feel free to use one of the following flows for integration of your application:

<Button href="/develop/dapps/ton-connect/react" colorType={'primary'} sizeType={'sm'}>React Web Apps</Button>
<Button href="/develop/dapps/ton-connect/react" colorType={'primary'} sizeType={'sm'}>React Apps</Button>
<Button href="/develop/dapps/ton-connect/web"
colorType="secondary" sizeType={'sm'}>
HTML/JS Web Apps
HTML/JS Apps
</Button>
<Button href="/develop/dapps/ton-connect/tg-bot-integration"
colorType="secondary" sizeType={'sm'}>
Expand Down
2 changes: 1 addition & 1 deletion docs/develop/overview.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ This resource aims to provide you with all the necessary information you'll need
This is a collaborative open-source initiative, and contributions are always welcome. All documentation can be edited via GitHub, just [follow these instructions](/contribute).

- _Get Started with TON_ is a step-by-step guide to interacting with TON Blockchain. (video tutorial included)
- _TON Hello World_ series provides detailed step-by-step guides to wallets, smart contracts, web apps, and testing & debugging smart contracts on TON.
- _TON Hello World_ series provides detailed step-by-step guides to wallets, smart contracts, mini apps, and testing & debugging smart contracts on TON.


<Button href="/develop/get-started-with-ton" colorType={'primary'} sizeType={'sm'}>Get Started with TON</Button>
Expand Down
4 changes: 2 additions & 2 deletions sidebars.js
Original file line number Diff line number Diff line change
Expand Up @@ -334,12 +334,12 @@ const sidebars = {
{
type: 'doc',
id: 'develop/dapps/ton-connect/react',
label: 'React Web Apps',
label: 'React Apps',
},
{
type: 'doc',
id: 'develop/dapps/ton-connect/web',
label: 'HTML/JS Web Apps',
label: 'HTML/JS Apps',
},
{
type: 'doc',
Expand Down

0 comments on commit db893df

Please sign in to comment.