-
Notifications
You must be signed in to change notification settings - Fork 61
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
1 changed file
with
101 additions
and
114 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,133 +1,120 @@ | ||
| <p align="center"> | ||
| <br> | ||
| <img width="240" src="./assets/tapps.png" alt="logo of Telegram Mini Apps"> | ||
| <br> | ||
| <br> | ||
| </p> | ||
|
|
||
| # Awesome Telegram Mini Apps | ||
| A curated list of awesome things related to Telegram Mini Apps (TMA). | ||
|
|
||
| ## Table of contents | ||
| - [Awesome Telegram Mini Apps](#awesome-telegram-mini-apps) | ||
| - [Table of contents](#table-of-contents) | ||
| - [Resources](#resources) | ||
| - [Official Resources](#official-resources) | ||
| - [External Resources](#external-resources) | ||
| - [Community](#community) | ||
| - [Libraries](#libraries) | ||
| - [Boilerplates](#boilerplates) | ||
| - [UI \& Components](#ui--components) | ||
| - [Examples](#examples) | ||
| - [Youtube](#youtube) | ||
| - [Tutorials](#tutorials) | ||
| - [Courses](#courses) | ||
| - [Public Talks](#public-talks) | ||
| - [Projects Using Telegram Mini Apps](#projects-using-telegram-mini-apps) | ||
| - [Commercial Products](#commercial-products) | ||
|
|
||
| <!-- md-parser-start --> | ||
| # Awesome Telegram Mini Apps [](https://github.com/sindresorhus/awesome) | ||
|
|
||
| ## Resources | ||
| <img src="assets/tapps.png" align="right" width="100" style="max-width: 100%" /> | ||
|
|
||
| ### Official Resources | ||
| > A curated list of awesome things related to Telegram Mini Apps. | ||
| - [Official Guide](https://core.telegram.org/bots/webapps) | ||
| - [Release Notes](https://core.telegram.org/bots/webapps#recent-changes) | ||
| Telegram Mini Apps are web apps that are launched right inside [Telegram](https://telegram.org), letting them have a consistent user experience. | ||
| They can take advantage of many features out of the box, including seamless authorization, integrated payments, push notifications, and much more. | ||
|
|
||
| ### External Resources | ||
| - [Community Guide](https://docs.twa.dev/) | ||
| - [TON Guide](https://docs.ton.org/develop/dapps/twa) | ||
| - [TON Play](https://docs.tonplay.io/) — TON Play Toolkit allows to launch new and existing games on Telegram or our platform and integrate them with the robust TON infrastructure for fast, reliable, and easy-to-use blockchain elements, including payments. | ||
| ## Contents | ||
|
|
||
| ### Community | ||
| - [Resources](#resources) | ||
| - [Articles](#articles) | ||
| - [Talks](#talks) | ||
| - [Videos](#videos) | ||
| - [UI Kits](#ui-kits) | ||
| - [Libraries](#libraries) | ||
| - [Templates](#templates) | ||
| - [Projects](#projects) | ||
| - [Products](#products) | ||
| - [Communities](#communities) | ||
|
|
||
| - [Telegram Chat](https://t.me/twa_dev) | ||
| - [GitHub Telegram Mini Apps Community](https://github.com/twa-dev) | ||
| - [GitHub TON Community](https://github.com/ton-community) | ||
|
|
||
| ### Libraries | ||
| - [@twa-dev/SDK](https://github.com/twa-dev/SDK) — NPM package for Telegram Mini Apps SDK | ||
| - [@twa-dev/types](https://github.com/twa-dev/types) — Types for Telegram Mini Apps SDK | ||
| - [@twa-dev/Mark42](https://github.com/twa-dev/Mark42) — Simple lightweight tree-shakable UI library for Telegram Mini Apps | ||
| - [@twa.js](https://github.com/Telegram-Web-Apps/twa.js) — Mono-repository, containing all the packages, connected with comfortable and safe TypeScript development on Telegram Mini Apps platform. | ||
| - [@ton-connect/sdk](https://github.com/ton-connect/sdk) — Implementation of the TonConnect protocol | ||
| - [Flutter Telegram Mini App](https://pub.dev/documentation/flutter_telegram_web_app/latest/) | ||
| - [Typings for Telegram Mini Apps](https://github.com/DavisDmitry/telegram-webapps/tree/master) | ||
| - [Library for TMA init data on Go](https://github.com/Telegram-Mini-Apps/init-data-golang) | ||
|
|
||
|
|
||
| ### Boilerplates | ||
| - [@twa-dev/webpack-boilerplate](https://github.com/twa-dev/webpack-boilerplate) — Webpack-based modern boilerplate featuring based on React | ||
| - [@twa-dev/vanilla-js-boilerplate](https://github.com/twa-dev/vanilla-js-boilerplate) — Basic and straightforward boilerplate based on simple web technologies: JavaScript, HTML, and CSS. | ||
| - [@twa-dev/vite-boilerplate](https://github.com/twa-dev/vite-boilerplate) — Vite is a modern frontend tool that offers several advantages over traditional build tools, including faster development times, smaller bundle sizes, and improved developer experience. It supports React, Vue, Svelte and many more. | ||
| - [TON Telegram Mini Apps template](https://github.com/ton-community/twa-template) | ||
| - [@ton-defi-org/tonstarter-twa](https://github.com/ton-defi-org/tonstarter-twa) — Template for new Telegram Mini Apps interaction with TON | ||
| - [Telegram Onboarding Kit](https://github.com/Easterok/telegram-onboarding-kit) | ||
| ## Resources | ||
|
|
||
| - [Official Guide](https://core.telegram.org/bots/webapps) | ||
| - [Changelog](https://core.telegram.org/bots/webapps#recent-changes) | ||
| - [Community Guide](https://docs.telegram-mini-apps.com) | ||
| - [TON Documentation Guide](https://docs.ton.org/develop/dapps/twa) | ||
| - [Telegram Mini Apps Issues](https://github.com/Telegram-Mini-Apps/issues) | ||
| - [Trending Apps](https://t.me/trendingapps) | ||
|
|
||
| ### Articles | ||
|
|
||
| ###### English | ||
|
|
||
| ### UI & Components | ||
| - [Figma Telegram UI Components](https://www.figma.com/@firststagelabs) | ||
| - [@tonconnect/ui-react](https://www.npmjs.com/package/@tonconnect/ui-react) — React UI kit for TonConnect SDK | ||
| - [@tonconnect/ui](https://github.com/ton-connect/sdk/tree/main/packages/ui) — UI kit for TonConnect SDK | ||
|
|
||
| ### Examples | ||
| - [Example for booking hotels](https://github.com/vkruglikov/react-telegram-web-apphttps://github.com/neSpecc/telebook) | ||
| - [Sticker Catalog](https://github.com/fstik-app/catalog) | ||
| - [Chess multiplayer](https://github.com/Quatern1on/ChessNowBot) | ||
| - [Demo flow for ride requests](https://github.com/ArashYounesi/TRide) | ||
| - [One-time 2FA password generator](https://github.com/UselessStudio/TeleOTP) | ||
| - [Event Telegram Mini-App Demo](https://github.com/mbasaglia/mini_apps) | ||
| - [Notes and to-do lists](https://github.com/deptyped/notepher-bot) | ||
| - [Paint Bot](https://github.com/hip-hyena/PaintBot) | ||
| - [Call scheduling](https://github.com/arterialist/Callegram) | ||
| - [Booking system for medical services](https://github.com/Latand/MedSyncWebApp) | ||
| - [Dummy Wallet app](https://github.com/erfanmola/DPXWallet) | ||
| - [Calculator](https://github.com/ArashYounesi/TCalculator) | ||
| - [Wishlist](https://github.com/grulex/telegram-wishlist-miniapp) | ||
| - [React Example](https://github.com/vkruglikov/react-telegram-web-app) | ||
| - [Shop Example](https://github.com/TheCymond/Telegram_Web_App/ga) | ||
| - [Next.js with Tailwind](https://github.com/mauriciobraz/next.js-telegram-webapp) | ||
| - [aiogram](https://github.com/abdullaev388/Telegram-Web-App) | ||
| - [Date and time picker](https://github.com/Expented/tgdtp) | ||
| - [Example with Python](https://github.com/poshl000/telegram-webapp-bot) | ||
| - [Bots playground example](https://github.com/revenkroz/telegram-web-app-bot-example) | ||
| - [Playground example](https://github.com/mihailgok/telegramwebapps) | ||
| - [Small tutorial](https://github.com/mihailgok/telegramwebapps) | ||
| ### Youtube | ||
| - [Telegram Mini Apps: tips and hacks | Arthur Stambultsyan](https://www.youtube.com/watch?v=amvZy9hzAic&t=2476s&pp=ygURdGVsZWdyYW0gd2ViIGFwcHM%3D) | ||
| - 🇷🇺 [СОЗДАЕМ упрощенный DURGER KING](https://www.youtube.com/watch?v=O1ZRJXKBa4U&pp=ygURdGVsZWdyYW0gd2ViIGFwcHM%3D) | ||
| - 🇷🇺 [Web app TELEGRAM Бот на node js и React](https://www.youtube.com/watch?v=MzO-0IYkZMU&pp=ygURdGVsZWdyYW0gd2ViIGFwcHM%3D) | ||
| - 🇷🇺 [Как открыть WebApp и запустить магазин в Телеграм канале](https://www.youtube.com/watch?v=nznt4-J-oHs&pp=ygURdGVsZWdyYW0gd2ViIGFwcHM%3D) | ||
| - 🇷🇺 [Web App Telegram Bot (React + Telegram Bot) + Bot Revolution](https://www.youtube.com/watch?v=FCHNnZ2KDUQ&pp=ygURdGVsZWdyYW0gd2ViIGFwcHM%3D) | ||
| - 🇷🇺 [Создаем Telegram бота](https://www.youtube.com/watch?v=-m5cUud_VzI&list=PLN0sMOjX-lm5BMwTm-llmJuA50umZJOsL) | ||
| - 🇺🇦 [Web App in the Telegram bot](https://www.youtube.com/watch?v=Gu2BB4G5Gdg&pp=ygURdGVsZWdyYW0gd2ViIGFwcHM%3D) | ||
|
|
||
| ### Tutorials | ||
| - [Step-by-Step guide to build a Telegram Chatbot with a simple WebApp UI using Python](https://medium.com/@calixtemayoraz/step-by-step-guide-to-build-a-telegram-chatbot-with-a-simple-webapp-ui-using-python-44dca453522f) | ||
| - [Telegram Mini App with React and Next.js](https://dev.to/bitofuniverse/telegram-web-app-with-react-and-nextjs-440i) | ||
| - [Creation of Telegram Mini Apps and interaction with them in telegram bots](https://prog.world/creation-of-telegram-web-apps-and-interaction-with-them-in-telegram-bots/) | ||
| - [Telegram Mini Apps Issues](https://github.com/Telegram-Mini-Apps/issues) | ||
| - 🇷🇺 [Создание Telegram Mini Apps и взаимодействие с ними в телеграм ботах](https://habr.com/ru/articles/666278/) | ||
| - [Creation of Telegram Mini Apps and interaction with them in Telegram bots](https://prog.world/creation-of-telegram-web-apps-and-interaction-with-them-in-telegram-bots) | ||
|
|
||
| ###### Russian | ||
|
|
||
| - [Создание Telegram Mini Apps и взаимодействие с ними в Телеграм ботах](https://habr.com/ru/articles/666278) | ||
|
|
||
| ## Talks | ||
|
|
||
| ### Courses | ||
| - 🇷🇺 [Телеграм бот на Python](https://itproger.com/course/telegram-bot) — Представляем курс для начинающих по разработке Telegram ботов на Python. За курс вы с нуля научитесь создавать Телеграм ботов в разных жанрах и с использованием разных библиотек. | ||
| - [Telegram Web Apps: web applications inside Telegram (Russian)](https://holyjs.ru/en/talks/7ce6dd405449413daf154fcd6a476fdb) | ||
|
|
||
| ### Public Talks | ||
| - 🇷🇺 [Telegram Mini Apps: веб-приложения внутри Telegram](https://holyjs.ru/en/talks/7ce6dd405449413daf154fcd6a476fdb/) | ||
| ## Videos | ||
|
|
||
| ###### English | ||
|
|
||
| ## Projects Using Telegram Mini Apps | ||
| - [Telegram Mini Apps: tips and hacks | Arthur Stambultsyan](https://www.youtube.com/watch?v=amvZy9hzAic&t=2476) | ||
|
|
||
| ### Commercial Products | ||
| - [TON Play](https://tonplay.io/) — Toolkit that allows game developers to leverage the power of Telegram | ||
| - 🇷🇺 [Telegram Shops Platform](https://telegramwebapps.ru/) | ||
| ###### Russian | ||
|
|
||
| - [СОЗДАЕМ упрощенный DURGER KING](https://youtu.be/O1ZRJXKBa4U) | ||
| - [Web app TELEGRAM Бот на node js и React](https://youtu.be/MzO-0IYkZMU) | ||
| - [Как открыть WebApp и запустить магазин в Телеграм канале](https://youtu.be/nznt4-J-oHs) | ||
| - [Web App Telegram Bot (React + Telegram Bot) + Bot Revolution](https://youtu.be/FCHNnZ2KDUQ) | ||
| - [Создаем Telegram бота](https://www.youtube.com/watch?v=-m5cUud_VzI&list=PLN0sMOjX-lm5BMwTm-llmJuA50umZJOsL) | ||
|
|
||
| ###### Ukrainian | ||
|
|
||
| <!-- md-parser-end --> | ||
| <br/> | ||
| <br/> | ||
| <br/> | ||
| - [Web App in the Telegram bot](https://youtu.be/Gu2BB4G5Gdg) | ||
|
|
||
| [](https://creativecommons.org/publicdomain/zero/1.0/) | ||
| ## UI Kits | ||
|
|
||
| - [Telegram Graphics Figma file](https://www.figma.com/community/file/1248595286803212338/telegram-graphics) | ||
| - [@tonconnect/ui-react](https://www.npmjs.com/package/@tonconnect/ui-react) | ||
| - [@tonconnect/ui](https://github.com/ton-connect/sdk/tree/main/packages/ui) | ||
| - [@twa-dev/Mark42](https://github.com/twa-dev/Mark42) - A simple, lightweight, and tree-shakable UI library for Telegram Mini Apps. | ||
|
|
||
| ## Libraries | ||
|
|
||
| - [@twa-dev/SDK](https://github.com/twa-dev/SDK) - The [WebApp API](https://core.telegram.org/bots/webapps#initializing-mini-apps) as an npm package. | ||
| - [@twa.js](https://github.com/Telegram-Web-Apps/twa.js) - A monorepository that contains everything you need to develop Telegram Mini Apps in TypeScript. | ||
| - [flutter_telegram_web](https://pub.dev/documentation/flutter_telegram_web_app/latest) | ||
| - [Typings for Telegram Mini Apps](https://github.com/DavisDmitry/telegram-webapps/tree/master) - TypeScript typings for the WebApp API. | ||
| - [init-data-golang](https://github.com/Telegram-Mini-Apps/init-data-golang) - Init data validation utilities for Go. | ||
|
|
||
| ## Templates | ||
|
|
||
| - [@twa-dev/webpack-boilerplate](https://github.com/twa-dev/webpack-boilerplate) | ||
| - [@twa-dev/vanilla-js-boilerplate](https://github.com/twa-dev/vanilla-js-boilerplate) | ||
| - [@twa-dev/vite-boilerplate](https://github.com/twa-dev/vite-boilerplate) | ||
| - [TON integration template](https://github.com/ton-community/twa-template) | ||
| - [@ton-defi-org/tonstarter-twa](https://github.com/ton-defi-org/tonstarter-twa) | ||
| - [Telegram Onboarding Kit](https://github.com/Easterok/telegram-onboarding-kit) | ||
|
|
||
| ## Projects | ||
|
|
||
| - [Telebook](https://github.com/neSpecc/telebook) - Hotel booking app concept. | ||
| - [fStik](https://github.com/fstik-app/catalog) - Telegram sticker catalog. | ||
| - [ChessNowBot](https://github.com/Quatern1on/ChessNowBot) - Play chess live with other Telegram users. | ||
| - [TRide](https://github.com/ArashYounesi/TRide) - Ride booking app concept. | ||
| - [TeleOTP](https://github.com/UselessStudio/TeleOTP) - A one-time password generator. | ||
| - [Mini Events](https://github.com/mbasaglia/mini_apps) - Python framework to create event-based Mini Apps. | ||
| - [Notepher](https://github.com/deptyped/notepher-bot) - A note taking app synced with the Telegram cloud. | ||
| - [@PaintBot](https://github.com/hip-hyena/PaintBot) - Collaboratively create small hand-drawn images. | ||
| - [MedSync](https://github.com/Latand/MedSyncWebApp) - Healthcare booking app concept. | ||
| - [DPXWallet](https://github.com/erfanmola/DPXWallet) - Crypto wallet app concept. | ||
| - [Calculator](https://github.com/ArashYounesi/TCalculator) | ||
| - [Wishlist](https://github.com/grulex/telegram-wishlist-miniapp) | ||
| - [React Example](https://github.com/vkruglikov/react-telegram-web-app) | ||
| - [Shop Example](https://github.com/TheCymond/Telegram_Web_App) | ||
| - [Next.js Example](https://github.com/mauriciobraz/next.js-telegram-webapp) | ||
| - [aiogram-aiohttp Example](https://github.com/abdullaev388/Telegram-Web-App) | ||
| - [Datetime Picker](https://github.com/Expented/tgdtp) | ||
| - [Python Backend Example](https://github.com/poshl000/telegram-webapp-bot) | ||
| - [API Interactions Example](https://github.com/revenkroz/telegram-web-app-bot-example) | ||
|
|
||
| ## Products | ||
|
|
||
| - [TON Play](https://tonplay.io) - A toolkit that allows game developers to leverage the power of Telegram. | ||
| - [Telegram Shop Platform](https://telegramwebapps.ru) | ||
|
|
||
| ## Communities | ||
|
|
||
| - [Telegram Chat](https://t.me/twa_dev) | ||
| - [twa-dev GitHub](https://github.com/twa-dev) |