Developing Web Apps Locally
Telegram and its ecosystem are growing rapidly at an unstoppable speed. This has attracted the attention of zillions of people around the globe, including developers.
The Telegram APIs are of course not off this rapid growth. They are constantly developed further to enhance the experience of the users.
Web Apps are a bunch of capabilities of Telegram bots introduced in a revolutionary update on the 16th of April.
The Way They Work
Whenever a user launches a Web App instance in any way (inline, through a button, or from the attachments menu), their Telegram client will be responsible for opening the web page which the bot provided in its response.
The Obstacle Against Developers
The web page that the bot can request to be opened is identified by a URL. A URL that should be linked to a registered ICANN domain name with HTTPS as its protocol. This makes it quite hard to get started with developing Web Apps.
That’s because everyone just won’t want to start worrying about setting up a web server, making it accessible, connecting it do a domain, waiting for things to propagate, initiating a proper connection with it and etc.
I’ll be talking about an easy way to make developing Web Apps locally possible without taking care of any of these.
Step 1: localhost to a Local Domain Name
- Open the hosts file. On Windows, it is located at
C:\Windows\System32\drivers\etc\hosts, Linux’s is
/etc/hostsand macOS’ is at
- Append a line similar to this:
You could replace
mydomain.comwith any other valid ICANN domain name.
That’s how we have a domain name locally. We’re almost done.
Step 2: Acquiring the TLS Certificate
mkcerton your system.
- Run the following commands:
mkcert mydomain.com localhost 127.0.0.1
That will generate the TLS certificate and key for your local domain name and hostnames, so that you can use it with your local server for Web Apps. Remember that the
mydomain.com might be another domain, depending on how you modified your hosts file.
If you have completed the steps above, you can now start a local web server on port 443 using the generated TLS certificate, and then host your Web App’s front end easily. This can be an NGINX server block proxy passing to your app on a different port, along with your TLS certificate.
After starting the local web server, you can let your development bot open the Web App at your local domain using the HTTPS URL (e.g.
Note that you will only be able to test your Web App from the machine you are hosting it from. If you want other devices in your LAN to be able to use it, you will have to setup a local DNS server. I might talk about this in another post.