feat(tma): add dev workflow pages

docs.json

@@ -229,6 +229,9 @@
             "pages": [
               "ecosystem/tma/overview",
               "ecosystem/tma/create-mini-app",
+              "ecosystem/tma/getting-app-link",
+              "ecosystem/tma/test-environment",
+              "ecosystem/tma/debugging",
               {
                 "group": "Telegram UI",
                 "pages": [

ecosystem/tma/debugging.mdx

@@ -0,0 +1,76 @@
+---
+title: "Debugging"
+---
+
+import { Aside } from '/snippets/aside.jsx';
+
+Each Telegram platform has its own way to enable WebView debugging for Mini Apps.
+
+## Telegram Desktop
+
+1. Download the [Beta Version](https://desktop.telegram.org/changelog#beta-version) of Telegram Desktop.
+1. Go to <kbd>Settings</kbd> > <kbd>Advanced</kbd> > <kbd>Experimental settings</kbd>.
+1. Enable <kbd>Enable webview inspecting</kbd>.
+
+Right-click inside the Mini App and select <kbd>Inspect</kbd> to open developer tools.
+
+## Telegram for macOS
+
+1. Download the [Beta Version](https://telegram.org/dl/macos/beta) of Telegram for macOS.
+1. Click the Settings icon 5 times to open the Debug Menu.
+1. Enable <kbd>Debug Mini Apps</kbd>.
+
+Right-click inside the Mini App and select <kbd>Inspect Element</kbd>.
+
+## Telegram for Android
+
+1. [Enable USB debugging](https://developer.chrome.com/docs/devtools/remote-debugging/) on the device.
+1. In Telegram, scroll to the bottom of <kbd>Settings</kbd> and press and hold the **version number** twice.
+1. Enable <kbd>Enable WebView Debug</kbd> in Debug Settings.
+1. Connect the device to a computer and open `chrome://inspect/#devices` in Chrome.
+
+The Mini App WebView appears in the device list when launched.
+
+## Telegram for iOS
+
+iOS WebView debugging requires Safari on macOS.
+
+On the iOS device:
+
+1. Go to <kbd>Settings</kbd> > <kbd>Safari</kbd> > <kbd>Advanced</kbd>.
+1. Enable <kbd>Web Inspector</kbd>.
+
+On macOS:
+
+1. Open Safari > <kbd>Settings</kbd> (<kbd>Cmd</kbd> + <kbd>,</kbd>) > <kbd>Advanced</kbd>.
+1. Enable <kbd>Show features for web developers</kbd>.
+
+Then:
+
+1. Connect the iOS device to the Mac via cable.
+1. Open the Mini App in Telegram on the iOS device.
+1. In Safari on macOS, open the <kbd>Develop</kbd> menu and select the connected device.
+1. Select the WebView URL listed under <kbd>Telegram</kbd>.
+
+<Aside type="tip">
+  After the initial cable connection, select **Connect via Network** to debug wirelessly.
+</Aside>
+
+## Eruda
+
+[Eruda](https://www.npmjs.com/package/eruda) is a lightweight in-browser console. Use it when native developer tools are not available (for example, on iOS without a Mac).
+
+```html
+<script src="//cdn.jsdelivr.net/npm/eruda"></script>
+<script>eruda.init()</script>
+```
+
+Or install via npm:
+
+```typescript
+import eruda from 'eruda';
+
+eruda.init();
+```
+
+After initialization, a floating button appears in the UI. Tap it to open the console.

ecosystem/tma/getting-app-link.mdx

@@ -0,0 +1,75 @@
+---
+title: "Getting app link"
+---
+
+import { Aside } from '/snippets/aside.jsx';
+
+Every Mini App needs a URL that Telegram uses to load the app content. Telegram does not host Mini Apps — provide a URL pointing to an external server.
+
+The production environment requires HTTPS with a valid SSL certificate. The [test environment](/ecosystem/tma/test-environment) also accepts HTTP and raw IP addresses.
+
+## Registering in BotFather
+
+Before setting a URL, create a bot and register a Mini App:
+
+1. Open [BotFather](https://t.me/botfather) and send `/newbot`. Follow the prompts to create a bot.
+1. Send `/newapp` and follow the prompts to register a Mini App linked to the bot.
+
+The app becomes available at `https://t.me/<BOT_USERNAME>/<APP_NAME>`.
+
+<Aside type="note">
+  To use a Mini App as a bot menu button instead of a standalone app, send `/setmenubutton` to BotFather. The app opens when a user taps the menu button in the bot chat.
+</Aside>
+
+## Development links
+
+### Local
+
+Run a local dev server and use the resulting URL. Most bundlers (Vite, Webpack) provide HTTPS support through plugins or configuration.
+
+For a trusted HTTPS certificate on a custom domain, use [mkcert](https://github.com/FiloSottile/mkcert) to generate a local certificate authority and certificate.
+
+### Tunneling
+
+To expose a local server to the internet (for testing on other devices or setting in BotFather), use a tunneling service:
+
+- [ngrok](https://ngrok.com/) — each account has a free dev domain. Create a tunnel:
+
+```bash
+ngrok http --domain=<DEV_DOMAIN> <PORT>
+```
+
+- [localtunnel](https://localtunnel.github.io/www/) — free alternative:
+
+```bash
+npm install -g localtunnel
+lt --port <PORT> --subdomain <SUBDOMAIN>
+```
+
+The resulting URL (`https://<SUBDOMAIN>.loca.lt` or the ngrok domain) can be set in BotFather.
+
+## Production links
+
+Deploy the app to any hosting with HTTPS and a valid SSL certificate:
+
+- [GitHub Pages](https://pages.github.com/)
+- [Vercel](https://vercel.com/)
+- [Heroku](https://www.heroku.com/)
+
+For a free SSL certificate, use [certbot](https://certbot.eff.org/).
+
+## Setting the URL in BotFather
+
+### Menu button
+
+1. Send `/setmenubutton` to BotFather.
+1. Select the bot.
+1. Enter the app URL and a title for the menu button.
+
+### Direct link
+
+1. Send `/myapps` to BotFather.
+1. Select the app.
+1. Click <kbd>Edit link</kbd> and enter the app URL.
+
+The app is now accessible at `https://t.me/<BOT_USERNAME>/<APP_NAME>`.

ecosystem/tma/test-environment.mdx

@@ -0,0 +1,53 @@
+---
+title: "Test environment"
+---
+
+import { Aside } from '/snippets/aside.jsx';
+
+Telegram provides a separate test environment for Mini App development. It is fully isolated from production — bots, users, and data do not overlap between the two.
+
+The test environment accepts HTTP links and raw IP addresses when setting the Mini App URL in BotFather. The production environment requires HTTPS with a valid SSL certificate.
+
+<Aside type="tip">
+  Create bots and Mini Apps in the test environment during development. Switch to the production environment only for release.
+</Aside>
+
+<Aside type="note">
+  The test environment may have lower performance than production. If performance issues interfere with development, consider switching to a production bot with an HTTPS tunnel (see [Getting app link](/ecosystem/tma/getting-app-link#tunneling)).
+</Aside>
+
+## Creating a test account
+
+Test environment accounts can only be created on mobile Telegram clients.
+
+Use a test phone number in the format `99966XYYYY`:
+
+- `X` — data center number (1, 2, or 3)
+- `YYYY` — any four digits
+
+The confirmation code is the data center number repeated five times. For example, phone `9996612345` (data center 1) uses code `11111`.
+
+### Telegram for iOS
+
+1. Open <kbd>Settings</kbd> and tap the section header 10 times.
+1. Tap <kbd>Accounts</kbd>.
+1. Tap <kbd>Login to another account</kbd>.
+1. Tap <kbd>Test</kbd>.
+1. Enter a test phone number and the corresponding code.
+
+## Linking the test account to other clients
+
+After creating a test account on a mobile client, link it to desktop or web versions.
+
+### Telegram Desktop
+
+1. Open the side menu and expand the section with the current username.
+1. Hold <kbd>Shift</kbd> + <kbd>Alt</kbd> (<kbd>Option</kbd> on macOS) and right-click <kbd>Add Account</kbd>.
+1. Select <kbd>Test Server</kbd>.
+1. Log in with the account created on a mobile client.
+
+### Telegram for macOS
+
+1. Tap the Settings icon 10 times to open the Debug Menu.
+1. Hold <kbd>Cmd</kbd> and click <kbd>Add Account</kbd>.
+1. Log in with the account created on a mobile client.

resources/dictionaries/custom.txt

@@ -123,6 +123,7 @@ cbcast
 cbcasts
 CCITT
 celldb
+certbot
 Certik
 CEX
 CEXes