Kruskal's Algorithm Visualizer

An interactive and educational web application to visualize and understand Kruskal's Algorithm for finding the Minimum Spanning Tree (MST) of a graph.

🌟 Features

• Interactive Visualization: Watch as edges get selected, rejected (if they form a cycle), and connected in real-time.
• Step-by-Step Learning: Follow the greedy approach of Kruskal's Algorithm visually.
• Modern Landing Page: A beautifully designed landing page explaining the algorithm, its use cases, and how it works.
• No Setup Required: Jump right in and start learning.

🛠️ Tech Stack

• Landing Page: Built with Next.js, React, and Tailwind CSS. Features modern UI components, smooth animations using Framer Motion, and responsive design.
• Visualizer: Built with vanilla HTML, CSS, and JavaScript. Uses HTML Canvas/SVG for rendering the graphs and edges efficiently.

🚀 Getting Started

To run the project locally, follow these steps:

Prerequisites

Make sure you have Node.js installed on your machine.

Installation

1. Clone the repository:

   git clone https://github.com/sohamcodes-ctrl/Kruskal-Algorithm.git
   cd Kruskal-Algorithm

2. Navigate to the landing page directory:

   cd landing-page

3. Install dependencies:

   npm install

4. Start the development server:

   npm run dev

5. Open http://localhost:3000 in your browser.

   • You can explore the landing page and click "Launch Visualizer" to see the algorithm in action!

📁 Project Structure

• landing-page/: Contains the Next.js application for the landing page.
• landing-page/public/: Contains the static files for the Kruskal Visualizer (kruskal-visualizer.html, script.js, style.css), which are served directly from the landing page.

🤝 Contributing

Contributions, issues, and feature requests are welcome! Feel free to check the issues page.