Guess The Number
Guess The Number Game By Farman Ali
Guess The Number, created by Farman Ali, a self-taught MERN stack developer from Bahawalpur, Pakistan, is an engaging JavaScript game that challenges players to guess a random number between 1 and 100. Built with HTML, CSS, and JavaScript, it’s one of my best beginner projects—showcasing my skills in DOM manipulation, conditional logic, and state persistence with local storage. With a game-like UI, smart hints, and difficulty levels, it’s a fun way to test your logic while tracking your performance across sessions. Published on March 18, 2024, it’s live and ready to play!
Live
GitHub📌 Overview
Guess The Numberis an interactive game where the computer picks a secret number between 1 and 100, and players use logic and hints to guess it. Designed as a beginner JavaScript project, it’s packed with features like difficulty levels (Easy: 10 lives, Medium: 5 lives, Hard: 3 lives), performance tracking, and a responsive UI that works flawlessly on desktop and mobile.
I built this to push my JavaScript skills beyond the basics—focusing on dynamic user interactions, state management, and a polished game-like experience. Whether you’re a casual player or a developer checking out my code, it’s a fun way to see what I can do with vanilla JS.
✨ Features
🧠 Smart Hints
- Get feedback like “Too High” or “Too Low” to refine your guesses.
🎮 Game Levels
- Easy: 10 lives for a relaxed challenge.
- Medium: 5 lives for a balanced test.
- Hard: 3 lives for a real brain teaser.
💾 Local Storage
- Saves game stats (wins, losses, scores) across browser sessions.
📈 Performance Tracking
- Tracks win/loss ratio, total score, and accuracy percentage dynamically.
🔁 Game Over & Victory Popups
- Interactive modals with messages and replay options.
🧾 Guess History
- Displays all previous guesses to avoid repetition.
📜 Game Rules
- Accessible popup explains gameplay mechanics.
🖥️ Responsive UI
- Custom CSS ensures a seamless experience on any device.
💬 Motivation
I crafted Guess The Number to level up my JavaScript skills early in my journey as a developer. Beyond basic tutorials, I wanted a project that combined fun with technical depth—mastering conditional logic for hints, DOM manipulation for real-time updates, and local storage for persistence. It’s a simple concept turned into a dynamic, engaging experience—proof of how far I’ve come since starting out.
🛠️ Tech Stack
-
HTML: Structures the game layout and UI elements.
-
CSS: Custom styles for a game-like, responsive design.
-
JavaScript: Powers game logic, user interactions, and local storage.
-
VS Code: My go-to editor for building and testing.
🚀 Setup & Installation
Clone the repository:git clone https://github.com/farmanali6349/number-guessing-game.git
Navigate into the project:cd number-guessing-game
No dependencies—just openindex.htmlin a browser to play!
📦 Deployment
Deployed onNetlify—play it live now!
🗓️ Published
Released onMarch 18, 2024.
📬 Contact
- Name:Farman Ali
- Portfolio:farmanali.fun
- GitHub:farmanali6349
- LinkedIn:farmanali6349
