This "Hot or Cold" Number Guessing Game is a web-based application developed to demonstrate front-end web development skills. It allows users to interactively guess a randomly generated secret number with feedback guiding their attempts based on proximity to the correct number.
- A random secret number is chosen between 1 and 100 when the game starts.
- Users submit their guesses through an input field.
- Feedback is provided on each guess, indicating how "hot" (close) or "cold" (far) the guess is relative to the secret number. This feedback helps users adjust their subsequent guesses.
- JavaScript: The game logic and interactivity are handled using jQuery, manipulating the DOM for dynamic updates.
- HTML/CSS: Structured with semantic HTML and designed with CSS for a clear and engaging interface.
- Dynamic Feedback: Instant feedback is displayed after each guess to indicate its accuracy and proximity to the secret number, enhancing user engagement.
Given that this project is based on education material from a 2015 course, here are some suggestions for modernization:
- JavaScript Modernization: Refactor the JavaScript to utilize ES6+ features such as
letandconst, arrow functions, and template literals to improve readability and maintainability. - Responsive Design: Apply responsive design principles using CSS Flexbox or Grid to ensure compatibility with a range of devices and screen sizes.
- Accessibility Enhancements: Implement ARIA roles and better focus management to improve accessibility, ensuring keyboard and screen reader compatibility.
- Enhanced UI/UX: Consider refining the user interface and experience by providing clearer instructions, improving color contrast, and leveraging more intuitive navigation elements.
This project was originally created as a part of a front-end web development certification program. Special thanks to the instructors of the Thinkful bootcamp (acquired by Chegg) for their educational materials and guidance.