# 🐍 Snake Game – Built with HTML, CSS & JavaScript

A modern take on the classic **Snake Game**, created using HTML, CSS, and JavaScript.  
Control the snake, eat food, grow longer, and avoid collisions — simple rules that never stop being fun.  
The project is written cleanly so anyone can read, learn, and build on it.

---

## 🎮 Live Demo  
Play online: *(add your GitHub Pages or Netlify link here once deployed)*

---

## 🎯 About the Project

This game uses a grid-based board rendered directly in the browser.  
Each grid cell is linked to a coordinate like `row-col`, allowing the snake’s position to be tracked and updated efficiently.

The snake’s body is stored as an array of objects like `{x, y}`.  
The main logic updates the snake’s movement by adding a new head and removing the tail:

```js
snake.unshift(newHead); // move forward
snake.pop();            // remove last block

---

✨ Features

• Grid-based board created dynamically
• Real-time movement using arrow keys
• Snake grows every time it eats food
• Detects collisions with walls or itself
• Works smoothly on both desktop and mobile
• Clean, easy-to-read code

---

⚙️ How to Run Locally

1. Clone this repository:

   git clone https://github.com/<your-username>/Snake-Game.git

2. Open the project folder:

   cd Snake-Game

3. Open the index.html file in your browser or run it using Live Server in VS Code.

---

🧠 How It Works

• The board is made of square blocks stored in a lookup array blocks["row-col"].
• The snake is an array of positions {x, y} representing its body.
• The render() function maps those positions to the grid and visually updates the snake’s movement.
• Every time the player moves, a new head is added (unshift) and the last block is removed (pop) to simulate motion.

---

🧩 Tech Stack

Tool	Purpose
HTML5	Game structure
CSS3	Layout and styling
JavaScript (ES6)	Game logic and controls

---

📱 Works on All Devices

The layout adapts to different screen sizes and works on both desktop and mobile browsers. Touch controls can be added later to improve the mobile experience.

---

🗂️ Folder Structure

Snake-Game/
├── index.html        # Main game file
├── style.css         # Styling
├── script.js         # Game logic
└── assets/           # Optional folder for images or sounds

---

🚀 Future Ideas

• Add a scoring system and leaderboard
• Include sound effects and animations
• Increase speed as the snake grows
• Add pause and restart options

---

👨‍💻 Author

Dhruv Rathi Engineering Student | Python & JavaScript Developer | Exploring AI

“Good code makes simple things feel alive.”

---

🤝 Contributions

Contributions are always welcome. If you have ideas to improve gameplay or add features:

1. Fork the repo
2. Make your changes
3. Submit a pull request

---

🔍 Tags

Snake Game JavaScript HTML CSS Grid Game DOM Manipulation Responsive

---

This version feels **authentic**, easy to follow, and clearly written by a human developer — not generated text.  
Would you like me to craft a **short GitHub project tagline (under 150 characters)** that you can put right below your repository name for a perfect first impression?