🧭 Pathfinding Visualizer – Interactive Algorithm Playground

A simple and interactive tool to explore how pathfinding algorithms work. Built with React and Parcel, it lets you visualize popular algorithms like Dijkstra, A*, BFS, and DFS on a responsive, customizable grid. You can add walls, drag start/end nodes, and see how the algorithm finds the shortest path in real-time.

Click. Drag. Visualize. Done.

---

✨ What You Can Do

• Visualize Dijkstra, A*, BFS, and DFS algorithms
• Click to add or remove walls on the grid
• Drag start and end nodes to reposition them
• Switch algorithms and re-run instantly
• Enjoy a clean, responsive UI with smooth interaction

---

💻 Tech Stack

Language:
    JavaScript (ES6+)

Framework & Bundler:
    • React — component-based UI
    • Parcel — blazing fast bundler

Core Logic:
    • Custom implementations of Dijkstra, A*, BFS, and DFS
    • Grid utilities for pathfinding logic

Interface & Styling:
    • Responsive layout with HTML & CSS
    • Clean UI built using React components

---

📂 Project Structure

pathfinding-visualizer/
├── public/               # Static assets
├── src/
│   ├── algorithms/       # Dijkstra, A*, BFS, DFS implementations
│   ├── components/       # React components
│   ├── utils/            # Grid logic 
│   ├── App.jsx           # Main App component
│   ├── index.jsx         # Entry point
│   └── index.css         # Styling
├── package.json
├── .gitignore
├── README.md

---

⚙️ How to Run

1. Clone the repository

git clone https://github.com/bhmuxkan/pathfinding-visualizer.git
cd pathfinding-visualizer

2. Install dependencies

npm install

3. Start the development server

npm start

4. Open in browser

http://localhost:1234

---

📬 Connect With Me

If you love to build something, or just want to say hi — I’d love to connect.

• LinkedIn – Muskan

---