Это тестовое задание рассчитано для кандидатов на junior позиции и для новичков может показаться сложным. Более того, опциональные требования могут стать вызовом и для многих джунов =) Все же мы практикуемся, а значит чем сложнее придется сейчас, тем легче будет потом на техническом интервью. Суть задания заключается в создании приложения для расширения словарного запаса при изучении иностранных языков. В то же время, тестовые задания это хорошо, но выполнив задание один раз и забросив его вы также забросите полученные знания, так как без практики все забывается. При вашем желании, это тестовое задание может перерасти в pet-проект, который вы сможете использовать в своих личных целях и улучшать его на свое усмотрение. Так, написанный вами код будет периодически пересматриваться и улучшаться, а значит, никогда не забудется.
Введение
Исследования говорят о том, что новые слова лучше изучать не заучивая их поодиночке, а в составе семантической группы, например слова описывающие погоду или ваш поход в магазин. Люди, которые испытали разные подходы на практике рекомендуют свой подход: объединять разные слова в предложения и заучивать их в контексте этих предложения. Так мы и поступим.
В рамках этого задания вам предстоит создать приложение для изучения новых слов. В примере мы будем ориентироваться на английский язык, но вы можете выбрать любой другой. Вам необходимо подготовить список из 100 наиболее часто употребляемых слов и предложения с их использованием. Пример такого списка для Английского языка вы можете скачать ниже. Самым простым и быстрым способом подготовки такого списка для других языков будет использование ChatGPT, Gemini или любой другой AI модели.
Как и прежде, Вы можете реализовать только frontend или backend при частичном выполнении тестового задания либо все вместе для полного завершения. Для эмуляции бэкенда можно воспользоваться пакетом json-server, а проверить API можно с помощью Postman.
Требования
Создайте веб-приложение с помощью которого пользователь сможет изучать новую лексику. Приложение должно иметь две страницы или две вкладки, для изучения и для проверки изученной лексики.
На странице изучения лексики пользователю показываются слова, которые необходимо запомнить и предложение, в контексте которого эти слова употребляются. Также на странице должна быть кнопка Далее, для просмотра следующей группы слов и предложения.
На странице проверки лексики пользователю показывается предложение без слов, которые необходимо было запомнить (ключевые слова). Вместо ключевых слов поставлены пропуски. Под предложением размещены html инпуты, в которые необходимо вписать пропущенные слова и две кнопки: для проверки результата и для перехода к следующей лексике. Если проверка пройдена, пользователю показывается сообщение об успешной проверке, в противном случае, сообщение об ошибке. Кнопку перехода к следующей лексике можете блокировать до прохождения проверки или не блокировать, для того, чтобы можно было пропустить трудные случаи.
Опциональные требования
В задании не описан алгоритм по которому показывается лексика на странице изучения лексики. В самом простом варианте, лексика будет показываться с самого начала при каждом посещении страницы, что бессмысленно при большом списке слов. Разработайте свой алгоритм отображения лексики, который будет давать оптимальное количество повторов для запоминания слов и в то же время обеспечит полное прохождение списка со временем.
Новая лексика может плохо запоминаться если использовать только предложения. Вы можете добавить картинки с изображением того, что описывается в предложении и показывать их как дополнение.
На странице изучения лексики пользователь видит слова и предложения, но без практики произношения такой набор имеет малую пользу. Интегрируйте API по озвучиванию текста для прослушивания произношения лексики от любого провайдера: Google, Microsoft, Amazon. Подумайте о кешировании звуковых дорожек для оптимизации денежных затрат на использование API.
На странице проверки лексики вместо ключевых слов предоставляются инпуты, в которые необходимо вписать слова. Это может быть сложно на начальных этапах и обычно в подобных приложениях дают несколько опций в в виде группы кнопок с рандомной выборкой ключевых слов. Реализуйте этот или подобный ему вариант, если посчитаете нужным.
Требования frontend
Определите требования исходя из описания задания. Добавьте unit тесты.
Требования backend
Определите требования и необходимые эндпоинты исходя из описания задания. Добавьте unit тесты. Протестируйте созданное API с учетом общих тестовых сценариев.
Тестовые сценарии
Для проверки своей работы используйте следующие тестовые сценарии.
- Страница изучения лексики.
- Страница загружается успешно, и на ней отображаются слова и предложения для изучения, а также кнопка «Далее».
- Отображение слов и предложений. Слова и предложения отображаются корректно, и пользователь может ознакомиться с ними.
- Нажатие кнопки «Далее». Следующая группа слов и предложений загружается на страницу.
- Страница проверки лексики.
- Проверка успешного ввода. При правильных данных отображается сообщение об успешной проверке.
- Проверка неправильного ввода. При неправильных данных отображается сообщение об ошибке.
- Проверка пустого ввода. При отсутствии данных отображается сообщение об ошибке.
- Переход к следующей лексике. При нажатии на соответствующую кнопку пользователь может перейти к следующей проверке.
- Проверка обработки большого количества слов. Большое количество слов в инпуте вместо ключевого слова оценивается как неправильные данные.
