Daily Wordle Clone
A custom Wordle-like puzzle game fetching random 5-letter words from an external API, featuring dictionary validation, color-coded feedback, and multiple attempts—so you’re not stuck waiting for tomorrow’s puzzle.
Project Overview
Inspired by daily Wordle mania, you wanted more than one puzzle per day—so you built your own! This project also helped you deepen your knowledge of asynchronous requests, string manipulation, and DOM-based user feedback.
Implementation
Developed using three core files—index.html, styles.css, and script.js: 1. **HTML**: - A 6×5 grid for guesses, each cell changing color based on correctness. - An on-screen keyboard with letters, Enter, and Delete for easy input on any device. - A results area displaying messages (victory, failure) and a “Play Again” button. 2. **CSS**: - A simple layout with squares for each letter, color-coded (green, yellow, grey). - Minimal background (no linear gradient mania here—this time). 3. **JavaScript**: - Fetches a random 5-letter word from an API (random-word-api). - Validates each guess against dictionaryapi.dev to ensure real words. - Provides color-coded feedback in both the grid and keyboard. - Allows up to six attempts, after which the solution is revealed if not guessed. - Offers a “Play Again” feature to fetch a fresh word and reset the grid/keyboard.
Challenges
Ensuring accurate feedback for repeated letters, handling asynchronous fetch calls for both the random word and dictionary validation, and implementing a user-friendly “Play Again” flow without reloading the entire page.
Outcome
Successfully replicated the addictive Wordle experience—only now you can play endlessly instead of waiting for tomorrow’s puzzle. A perfect demonstration of external API usage, DOM manipulation, and user-friendly game design!
Project Gallery
