This project provides a complete boilerplate for building Telegram Mini Apps with modern web technologies: Next.js, TypeScript, TailwindCSS, Shadcn UI and Biome to provide an efficient and easy to use development environment.
- Next.js + TypeScript: Combine the power of React with TypeScript for robust, type-safe development.
- TailwindCSS: Quickly build and style your UI with this utility-first CSS framework.
- Shadcn with Custom Colors: Use pre-designed components with customizable color settings.
- Telegram Theme Integration: Automatically adjusts the app's theme based on Telegram's light or dark mode.
- Seamless Authentication: Easily integrate Telegram authentication with built-in support.
- Auto-expand Feature: Ensures your app automatically adjusts to full height within the Telegram client.
- Environment Variable Management: Easily configure settings for different environments.
- Effortless Mocking: Get started quickly with built-in mock environments for testing and development.
- Easy Access to InitData: Conveniently handle Telegram's authentication data with direct access to
initData
.
-
Set up environment variables: Copy the
.env.example
file to.env
:cp .env.example .env
-
Install dependencies:
npm install
-
Start the development server:
npm run dev
-
Open the provided URL in your Telegram client or browser.
Contributions are welcome! Please feel free to submit a Pull Request.
This project is open source and available under the MIT License.