Представляю бесплатного Telegram-бота, разработанного для эффективной подготовки к техническому собеседованию на позицию Frontend разработчика. Бот предлагает викторины по HTML, CSS, JavaScript и React, а также рейтинговый режим для соревнования с другими пользователями. Полный код проекта можно посмотреть в моем Github-репозитории.
Описание работы Telegram-бота
В боте присутствует 4 категории вопросов: HTML, CSS, JavaScript и React.
Чтобы было интереснее решать вопросы, я добавил еще 🏆Рейтинговый режим, в котором отсутствует выбор категории и вам предстоит решать все имеющиеся в базе вопросы. За каждый правильный ответ вам присуждается 1 балл. В случае неправильного ответа игра прекратится, а ее результат будет записан в базу данных и сохранен в вашем профиле.
Для добавления элемента соревнования между другими пользователями бота я добавил кнопку – Таблица лидеров, после нажатия на которую будет выведено ТОП-10 игроков Рейтингового режима.
У каждого игрока есть свой 👨🏼💻Профиль, в котором можно увидеть статистику по решенным вопросам в 4 категориях и баллы за игру в 🏆Рейтинговом режиме.
👨💻🎨 Библиотека фронтендера
Больше полезных материалов вы найдете на нашем телеграм-канале «Библиотека фронтендера»
Используемые технологии
- Node.js: Серверная платформа для выполнения JavaScript-кода.
- grammY: Фреймворк для создания Telegram-ботов.
- sqlite: Встраиваемая база данных для хранения результатов пользователей.
- date-fns: Библиотека для форматирования дат и времени.
- dotenv: Модуль для загрузки переменных окружения из .env файла.
Структура проекта
Рассмотрим структуру проекта, которая включает все необходимые файлы и директории.
- index.js: Основной файл проекта, содержащий весь код логики бота, включая инициализацию, обработку команд и взаимодействие с базой данных SQLite.
- questions/: Директория, содержащая JSON-файлы с вопросами по различным категориям (HTML, CSS, JavaScript, React).
Пример файла html_questions.json:
- leaderboard.db: Файл базы данных SQLite, в котором хранятся данные о пользователях, их результаты и время последней игры.
- .env: Этот файл содержит конфиденциальные данные, такие как токен API Telegram и ID администратора.
Пример файла .env:
Статья по теме
💪👨💻 6 сервисов для подготовки к техническим собеседованиям
Создание Telegram-бота
Создадим экземпляр бота и инициализируем его с API-ключом Telegram:
Определим начальное состояние сессии для каждого пользователя, которое взаимодействует с ботом:
Для скорости работы Telegram-бота добавим функцию для загрузки вопросов из JSON-файлов при запуске бота:
Для хранения данных о пользователях и их результатах в таблице лидеров инициализируем базу данных SQLite. Эта функция открывает (или создает) базу данных и создает таблицу leaderboard, если она еще не существует:
Добавим функции для работы с базой данных SQLite для управления профилями пользователей и их результатами в таблице лидеров.
- Функция createProfile. Эта функция создает профиль для пользователя, если его еще нет в таблице leaderboard.
- Функция updateLeaderboard. Эта функция обновляет таблицу лидеров для пользователя, добавляя или обновляя его запись в зависимости от результатов.
- Функция getLeaderboard. Эта функция возвращает топ 10 пользователей из таблицы лидеров, отсортированных по убыванию очков.
- Функция getTotalUsers. Эта функция возвращает общее количество пользователей в таблице лидеров.
Добавим функции обработки для команд Telegram-бота /start, /profile, /admin.
- Команда /start: Эта команда инициализирует бота и приветствует пользователя, предлагая начать использование бота.
- Команда /profile: Эта команда отображает профиль пользователя, включая его результаты в различных категориях.
- Команда /admin: Эта команда предназначена для администрирования и доступна только пользователю с ID администратора. Она отображает общее количество пользователей.
Осталось добавить функционал бота, связанный с обработкой сообщений пользователей и викторинами.
- Основная функция обработки сообщений. В зависимости от текста сообщения, бот вызывает соответствующую функцию для начала викторины по выбранной категории, запуска рейтингового режима или отображения таблицы лидеров.
- Функция handleQuizAnswer. Эта функция обрабатывает ответы пользователя на вопросы викторины.
- Функция startQuiz. Эта функция начинает викторину по указанной категории.
💼 Вакансии для фронтенд-разработчиков
Вакансии по фронтенду, джаваскрипт, React, Angular, Vue @jsdevjob
Заключение
В этой статье я рассмотрел основные составляющие моего Telegram-бота, необходимые для его работы. Полный код проекта можно посмотреть в моем Github репозитории. Опробовать бота можно по ссылке. У меня есть еще пара идей для улучшения его функциональности в будущем, планирую добавить блок вопросов с задачами по JavaScript и добавить больше статистик в профилях пользователей.
