Этот пост о том, как я начал работать с HTML5, CSS и vanillaJS для создания клона популярной игры Wordle.
Я начал с создания базовой структуры с помощью HTML. Как только я закончил с этим, я начал использовать JavaScript, чтобы перемещать повторяющиеся фрагменты кода в цикл.
Далее последовал стайлинг. Я использовал CSS для этого. В принципе, я старался сделать страницу похожей на настоящую игру.
Дальше пошла валидация. Я использовал JavaScript для сравнения значений текста, введенного в текстовые поля. Я также убедился, что текст в каждом поле будет иметь максимальную длину 1.
К этому моменту основные функции, которые я хотел предоставить, были готовы. Настало время улучшений — цветов, которые появлялись в зависимости от того, вводит ли человек правильную букву или нет, отключения прослушивателей событий, если слово найдено, и тому подобное.
Вы можете найти страницу по адресу https://anubhav823.github.io/wordle/
Исходный код можно найти по адресу https://github.com/anubhav823/wordle.