Hey Hashnode crew! If you’ve ever thought about building a Telegram Mini App (TMA) but got bogged down by the setup—choosing a stack, wiring up a backend, configuring Docker—then I’ve got something for you. Meet TMA Starter Kit, a no-nonsense starting point I’ve been tinkering with to make Telegram Mini App development fast, fun, and frustration-free. Let’s dive into what it is, how it’s built, and why it might just be your next go-to tool.
What’s This All About?
Telegram Mini Apps are those slick little web apps that live inside Telegram bots—think interactive menus, mini-games, or order trackers. They’re awesome, but getting started? Not so much. You’ve got to juggle a frontend, a backend, a database, and deployment, all while praying it plays nice with Telegram. That’s where TMA Starter Kit comes in.
It’s a pre-built, batteries-included foundation: a modern frontend, a lightweight backend, and DevOps goodies, all wired up and ready to roll. The goal? Cut the setup grind so you can focus on coding the cool stuff.
Why Bother with TMA Starter Kit?
I’ll level with you—building a TMA from scratch is a slog. You’re googling Vue.js configs, wrestling with Go routing, and cursing Docker networking before you even write a single feature. This kit skips the nonsense. Here’s what it brings to the table:
Zero-to-Running in Minutes: Clone it, run a Docker command, and boom—you’ve got a full app stack.
Solid Tech Choices: Quasar (Vue.js) with TypeScript, Go for the API, and MongoDB—tools you’ll actually enjoy using.
Docker Magic: Everything’s containerized. No “works on my machine” excuses here.
Telegram-Ready: Clear steps to hook it into a bot and go live.
Hackable: Modular setup means you can tweak it to fit your vibe.
The Stack Breakdown
Here’s how it’s pieced together—clean, simple, and purposeful:
frontend/: Powered by Quasar (Vue.js) with TypeScript and the Composition API. It’s where your Mini App’s UI lives—responsive, fast, and perfect for Telegram’s in-app vibe.backend/: A Go API that’s lean and mean. Handles your logic, talks to the frontend, and scales like a champ.devops/: Docker Compose files and CI/CD bits to keep it all humming. Spin up the whole stack with one command.
It’s all glued together with Docker, so whether you’re on a Mac, Linux, or that sketchy Windows laptop, it just works.
How Do You Use It?
Okay, let’s get practical. Here’s the quickstart:
Fire It Up:
docker compose -f devops/docker-compose.dev.yml up -dThis launches the frontend (port 9000), backend, and MongoDB in containers. Done.
Expose It: Install localtunnel (
npm i -g localtunnel), then:lt --port 9000 --subdomain my-cool-tmaYou’ll get a public URL like
https://my-cool-tma.loca.lt.Telegram Time:
Hit up @BotFather, make a bot with
/newbot.Use
/setmenuto link your localtunnel URL.Open your bot, tap the menu, and voilà—your Mini App’s live.
Total time? Maybe 10 minutes if you’re sipping coffee slowly.
Who’s This For?
Prototypers: Got a bot idea? Test it before dinner.
Side Hustlers: Building a client app? Ship it fast and look pro.
Tinkerers: New to TMA or modern stacks? Play around and learn.
A Real Example
Picture this: you’re coding a bot to track coffee orders for your team. With TMA Starter Kit:
Quasar frontend whips up a form in an hour.
Go backend saves orders to MongoDB with a few lines.
Docker and localtunnel get it online, and Telegram’s hosting your app by noon.
From scratch? You’d still be debugging CORS errors. Trust me, I’ve been there.
Why I Built It (and Why You Might Care)
I’m a sucker for Telegram’s ecosystem—it’s huge, engaged, and ripe for innovation. But every time I started a TMA, I wasted hours on boilerplate. So, I made this kit to scratch my own itch. If you’ve ever felt that setup pain, it might scratch yours too.
Give It a Spin
TMA Starter Kit isn’t some polished product—it’s a practical starting point, rough edges and all. Clone it, break it, make it yours. If you build something cool (or find a bug), hit me up—I’d love to hear about it.
Happy coding, Hashnode fam! Let’s build some killer Telegram apps together.