Awesome
Simple quiz Telegram Web App example
Inspired by zubiden/tg-web-bot-demo.
Demo bot: @yaqb_bot
What this bot can do?
This bot demonstrates how to develop Telegram bots with WebApp feature and simple setup backend with express.js
and grammyjs
webapp-vanilla is used in the project.
What is important?
- Keyboard Button use to additional Bot UI, because user data is not passed
- Inline Button use to handle user data like language and user id. It's useful for more loaded components like forms
- It is advisable not to use
JQuery
and build the project withVite
,Parcel
or other modern bundlers. - Be sure to use dark and light themes.
Installation and local launch in DEVELOPMENT mode
- Clone this repo:
git clone https://github.com/ShinkarenkoMaxim/simple-quiz
- Create
.env
file with the environment variables listed below - Run
yarn
in the root folder - Run
yarn build
- Run
yarn serve
andyarn bot
separately
If you want to add several features then you can create directory public/feature
and add to this directory your component and serve static file like in example:
app.use('feature', express.static('feature'));
Environment variables in .env
file
PORT
- port number for listen serverHOST
- hostname or your server ip address. For local development use Ngrok tunnelBOT_TOKEN
- telegram bot token