Тренажер HTML

Реализуйте тренажер для заучивания HTML тегов.

Продумайте структуру базы данных для хранения пользователей и вопросов по HTML тегам. В коде должен быть заранее подготовлен массив с вопросами (описание тега и правильный ответ). Реализуйте регистрацию и авторизацию пользователей. Настройте серверную часть для работы с API. Все операции должны выполняться через AJAX-запросы без перезагрузки страницы.

Основные возможности проекта

Регистрация и авторизация пользователей.
Вывод описания HTML тега.
Инпут для ввода названия тега.
Проверка ответа с красной подсветкой при ошибке.
Вопросы в случайном порядке.
Обратный отсчет времени на прохождение.
Прогресс пользователя сохраняется на сервере.

Регистрация и авторизация

На сайте должна быть реализована регистрация и авторизация пользователей:

Регистрация - форма с полями: логин, email, пароль.
Авторизация - форма с полями: логин, пароль.
Прогресс каждого пользователя сохраняется отдельно.
Все операции выполняются без перезагрузки страницы.

Главная страница

На странице должны быть размещены:

Описание HTML тега.
Инпут для ввода названия тега.
Кнопка "Проверить".
Таймер обратного отсчета.
Прогресс (сколько вопросов пройдено из общего количества).

Вопросы

Вопросы выводятся в случайном порядке. При правильном ответе переходим к следующему вопросу. При неправильном - граница инпута загорается красным цветом. После этого пользователь может попробовать снова. Прогресс пользователя сохраняется на сервере.

Таймер

При начале прохождения запускается таймер обратного отсчета. Время на прохождение - 60 секунд. Таймер отображается на странице. По истечении времени, если пользователь не успел ответить на все вопросы, тренажер считается проваленным и предлагает начать заново.

Завершение

Когда все вопросы пройдены правильно, тренажер поздравляет пользователя и предлагает пройти заново.

Взаимодействие с сервером

Все операции выполняются через AJAX-запросы:

При загрузке страницы список вопросов и прогресс пользователя загружаются с сервера.
При правильном ответе данные о прогрессе отправляются на сервер, после успешного ответа обновляется интерфейс.

Дополнительные возможности

Подсказка (первая буква тега).
Количество правильных и неправильных ответов.