Привет, коллеги! Делюсь с вами одним из моих последних проектов — разработкой Telegram Mini App для проекта Fibarium. Этот кейс демонстрирует, как можно эффективно использовать новые возможности Telegram для создания удобных и функциональных приложений. 1. Введение 📲 Telegram Mini Apps — это новая платформа для создания легких и быстрых приложений, которые интегрируются прямо в мессенджер. В этом проекте мне предложили взять фронтенд часть, не ограничивая по стеку и технологиям. Все решения были приняты мной. 2. Задача и цели 🎯 · Задача: Создать Mini App с элементами геймификации: спиннер с выдачей поинтов, задания, реферальная программа, лидерборд. Недавно добавили функционал закрытых групп (гильдий) и достижения. Цели: · Заверстать красиво по макетам дизайнера · Интегрировать нативные окна Telegram · Добавить анимации, проверку выполнения заданий, промежуточное хранение стейта на фронтенде, прямые ссылки на закрытые группы 3. Процесс разработки 🛠️ 1. Планирование и дизайн: · Еженедельный синк с дизайнером и бекендером для быстрой и четкой интеграции дизайна в мини-апп · Обратная связь по дизайну: что убрать, добавить, что сделать можно и как сделать удобнее 2. Разработка: · Использовал TypeScript, NextJS с SSR, Zustand, Lottie, Jest для создания и тестирования приложения. · Интегрировал @telegram-apps - официальную SDK для разработки мини-приложений. · Адаптировал верстку под разные платформы, ведь везде есть нюансы (safe area, свежие/старые версии Telegram, etc) · Добавил @tonconnect/ui-react для подключения кошелька Ton 3. Тестирование и оптимизация: · Провели тестирование на различных устройствах и платформах - IOS, Android, браузерная версия Telegram, MacOS и Windows · Оптимизировали производительность и исправили найденные баги. 4. Результаты и метрики успеха 🚀 · Приложение успешно запущено и доступно для всех пользователей Telegram. · Early адоптеры отметили удобство и простоту использования. · Используем posthog для метрики и отслеживания активности · Пайплайн на деплой автоматизирован через кубер и разделен на 2 бота - девелопмент и продакшен (бэкендер нереально чудесный человек, спасибо ему за это) 5. Выводы и уроки 📚 Разработка Telegram Mini App стала для меня отличным опытом, который показал, как можно эффективно использовать новые возможности платформы для создания полезных и удобных приложений. Я уверен, что Mini Apps имеют большой потенциал и будут активно развиваться в будущем. 6. Заключение 🌟 Если у вас есть идеи для создания собственного Mini App или вы хотите обсудить возможности сотрудничества, пишите в комментариях! Буду рад поделиться своим опытом и помочь вам в реализации ваших проектов. И спасибо команде, прекрасному дизайнеру и бэкендеру, за возможность реализовать такой крутой и серьезный проект!

Ссылка на проект Fibarium: https://t.me/FibariumBot/startapp?startapp=840e9b411480