Skip to content

Built a Sorting Visualizer using HTML, CSS, and JavaScript to demonstrate and compare sorting algorithms like Bubble Sort, Merge Sort, and Quick Sort

Notifications You must be signed in to change notification settings

YashPandey1405/Sorting-Visualizer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Sorting Visualizer

🔗 Live Demo: Sorting Visualizer
📂 Repository: GitHub - Sorting Visualizer


📜 Project Overview

The Sorting Visualizer is an interactive web application designed to visually demonstrate various sorting algorithms. It helps users understand how different algorithms work by dynamically displaying the sorting process in real-time. This tool is educational, user-friendly, and ideal for anyone learning or teaching sorting concepts.


🚀 Features

  • Dynamic Visualization: Watch sorting algorithms in action.
  • Multiple Algorithms: Supports popular algorithms like:
    • Bubble Sort
    • Selection Sort
    • Insertion Sort
    • Merge Sort
    • Quick Sort
  • User Interactivity: Control the speed of sorting, array size, and generate new arrays.
  • Responsive Design: Optimized for various screen sizes.

🛠 Technologies Used

  • Frontend:
    • HTML5: Structuring the web content.
    • CSS3: Styling and layout.
    • JavaScript (ES6): Implementing sorting algorithms and interactivity.
    • Bootstrap 4: Responsive design and UI components.

📈 Future Improvements

  1. Backend Integration:

    • Use Node.js and Express.js to enable user authentication and data storage.
    • Implement a backend leaderboard system to track sorting times.
  2. Enhanced UI/UX:

    • Upgrade the design using the latest Bootstrap version for a modern and sleek look.
    • Add customizable themes and accessibility features.
  3. Additional Features:

    • Support for more sorting algorithms.
    • Include a step-by-step explanation for each algorithm.
    • Allow users to input their own data sets for sorting.

🚀 Getting Started

Follow these steps to run the project locally:

1. Clone the Repository

git clone https://github.com/yashpandey1405/Sorting-Visualizer.git

2. Navigate to the Project Directory

cd Sorting-Visualizer

3. Open the Project in a Browser

  • Open the index.html file directly in your browser.

🤝 Contributing

Contributions are welcome! Feel free to fork the repository, create a new branch, and submit a pull request with your improvements.


📝 License

This project is open-source and available under the MIT License.


🙌 Acknowledgments

Special thanks to my friends who has supported this project, providing feedback and suggestions for future improvements!

About

Built a Sorting Visualizer using HTML, CSS, and JavaScript to demonstrate and compare sorting algorithms like Bubble Sort, Merge Sort, and Quick Sort

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published