tinwayJs 0.1 example Web page telegram bot

August 12, 2022

website: https://tinway.org
github: https://github.com/tinway/tinwayJS
Web Apps for Bots: https://core.telegram.org/bots/webapps


1. Create index.html

<!DOCTYPE html>
        <meta charset="utf-8" />
        <title>tinwayJS - A JavaScript library for building user interfaces</title>
        <div id="app"></div>
        <script src="https://telegram.org/js/telegram-web-app.js"></script>
        <script type="module" src="app.js"></script>
Enter fullscreen modeExit fullscreen mode

2. Create app.js

import {run} from './tinway.js'

let start = () => {

    let id = document.getElementById('id')
    id.innerHTML = window.Telegram.WebApp.initDataUnsafe.user.id

    let first_name = document.getElementById('first_name')
    first_name.innerHTML = window.Telegram.WebApp.initDataUnsafe.user.first_name

    let last_name = document.getElementById('last_name')
    last_name.innerHTML = window.Telegram.WebApp.initDataUnsafe.user.last_name



    start: start

Enter fullscreen modeExit fullscreen mode

import file tinway.js

function run() renders a web page!

  1. html: Path to html file.
  2. start: Run a function after rendering the page.

3. Create html file main.html

<div id="id"></div>
<div id="first_name"></div>
<div id="last_name"></div>
Enter fullscreen modeExit fullscreen mode

4. Add page to telegram bot

  • go to telegram bot https://t.me/BotFather

  • Send command /setmenubutton

  • Choose a bot

  • Please enter a valid URL. https is required

  • Enter a title to be displayed on the button instead of “Menu”

Telegram bot webpage created

And here the fantasies of developers are endless 🙂

tinwayJs starts a new open web journey! more cool features to come!

Source link

Comments 0

Leave a Reply

Your email address will not be published. Required fields are marked *