Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/philopaterhany/wordle-game
Wordle is a captivating word-guessing game where you unravel hidden words through strategic letter guesses. Sharpen your language skills and enjoy the thrill of wordplay with Wordle!
https://github.com/philopaterhany/wordle-game
css game html js wordle
Last synced: about 1 month ago
JSON representation
Wordle is a captivating word-guessing game where you unravel hidden words through strategic letter guesses. Sharpen your language skills and enjoy the thrill of wordplay with Wordle!
- Host: GitHub
- URL: https://github.com/philopaterhany/wordle-game
- Owner: PhilopaterHany
- Created: 2024-02-01T23:39:59.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2024-02-01T23:54:47.000Z (11 months ago)
- Last Synced: 2024-02-02T00:41:43.103Z (11 months ago)
- Topics: css, game, html, js, wordle
- Language: JavaScript
- Homepage: https://philopaterhany.github.io/Wordle-Game/
- Size: 158 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Wordle
Unleash Your Vocabulary Power
## Table of Contents
- [Overview](#overview)
- [The Challenge](#the-challenge)
- [Links](#links)
- [How To Play](#how-to-play)
- [My Approach](#our-approach)
- [Technologies Used](#technologies-used)
- [What I Learned](#what-we-learned)
- [Useful Resources](#useful-resources)
- [Author](#author)
## Overview
Wordle is an engaging word game designed to challenge and enhance your vocabulary. Built with simplicity and fun in mind, it offers an interactive and enjoyable experience for players of all ages. Wordle is a browser-based game, allowing users to enjoy wordplay anytime, anywhere.
### The Challenge
Wordle aims to:
- Provide an entertaining and educational word game.
- Enhance players' vocabulary skills.
- Offer a user-friendly and enjoyable gaming experience.
Player can:
- Guess a word from a variety of words.
- Get a link for each word to check its meaning and see examples after finishing the game.
### Links
- Styling: [Fonts & Colors](https://github.com/PhilopaterHany/Wordle-Game/blob/main/style-guide.md)
- Live Demo: [Start Playing](https://philopaterhany.github.io/Wordle-Game/)
## How To Play
To enjoy Wordle, follow these simple steps:
1. Access the game through the provided link.
2. Guess letters to complete the word.
3. Focus on the colors after each guess so you can use the letters wisely.
4. Celebrate your victories and learn from defeats.
5. Learn new words and their meanings from the link provided after each game.
## My Approach
### Technologies Used
- Semantic HTML5 Markup
- CSS Custom Properties
- Vanilla Javascript
- Sweetalert2 (for pop-ups)
- Animate.css (for animations)
### What I learned
```js
if (event.key === "Backspace") {
const inputs = document.querySelectorAll("input:not([disabled])");
const currentIndex = Array.from(inputs).indexOf(document.activeElement);
if (currentIndex >= 0) {
const currentInput = inputs[currentIndex];
const prevInput = inputs[currentIndex - 1];
if (currentInput.value === "" && prevInput) {
prevInput.value = "";
prevInput.focus();
currentInput.classList.remove("active");
} else {
currentInput.value = "";
}
}
}
```
### Useful Resources
- [Elzero Web School - Wordle Tutorial](https://youtu.be/e4P15Wc0wq8)
- [Sweetalert2 Documentation](https://sweetalert2.github.io/)
- [Animate.css Documentation](https://animate.style/)
## Author
- Website - Portfolio Is Coming Out Soon!
- Twitter - [@PhilopaterHany4](https://www.twitter.com/PhilopaterHany4/)
- Linkedin - [@phth](https://www.linkedin.com/in/phth/)
- Facebook - [Philopater Hany](https://www.facebook.com/philopater.hany.3)
- Discord - [#8178](https://discord.com/#8178/)
Wordle is not just a game; it's a journey into the world of words. We invite you to explore, challenge yourself, and have fun with words. As we continue to improve Wordle, we look forward to creating more wordy adventures for you.
Thank you for choosing Wordle, where words come to play! 📚✨
Let the word games begin! 🎉ðŸ”