Этот пост о том, как я начал работать с HTML5, CSS и vanillaJS для создания клона популярной игры Wordle.

Я начал с создания базовой структуры с помощью HTML. Как только я закончил с этим, я начал использовать JavaScript, чтобы перемещать повторяющиеся фрагменты кода в цикл.

Далее последовал стайлинг. Я использовал CSS для этого. В принципе, я старался сделать страницу похожей на настоящую игру.

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

К этому моменту основные функции, которые я хотел предоставить, были готовы. Настало время улучшений — цветов, которые появлялись в зависимости от того, вводит ли человек правильную букву или нет, отключения прослушивателей событий, если слово найдено, и тому подобное.

Вы можете найти страницу по адресу https://anubhav823.github.io/wordle/

Исходный код можно найти по адресу https://github.com/anubhav823/wordle.