Skip to content

README.md

Latest commit

 

History

History
78 lines (50 loc) · 1.81 KB

README.md

File metadata and controls

78 lines (50 loc) · 1.81 KB

🧩 Algorithms Visualizer

Live Demo: 👉 https://sofiia13.github.io/algorithms-visualizer/

An interactive algorithms visualizer that demonstrates how different sorting algorithms work — step by step, in real time.
Built for learning, exploring, and just enjoying the beauty of algorithms ✨

🚀 Features

  • 🎞️ Real-time animation of sorting algorithms
  • ⚙️ Adjustable array size
  • 💡 Clear and minimal UI built for intuition and fun
  • 🌐 Deployed on GitHub Pages

🧠 Implemented Algorithms

  • 🫧 Bubble Sort
  • 🔍 Selection Sort
  • ✋ Insertion Sort
  • ⚡ Quick Sort
  • 🔀 Merge Sort

🗄️ Data Structures Visualizer

On a separate page of the project, you can visually explore how different data structures work:

  • 🔹 Stack — push/pop, LIFO

  • 🔹 Queue — enqueue/dequeue, FIFO

  • 🔹 Priority Queue — elements with priority

  • 🔹 Heap — insertion/deletion, sorting

The interactive visualizer helps understand how basic data structures operate and allows experimenting with them in real time.

🛠️ Tech Stack

  • React (JavaScript ES6+)
  • HTML5 / CSS3
  • Vite or Create React App
  • GitHub Pages for deployment

🧩 Installation & Setup

1. Clone the repository

git clone https://github.com/sofiia13/algorithms-visualizer.git
cd algorithms-visualizer

2. Install dependencies

npm install

3. Run the development server

npm run dev

🎮 How to Use

  1. Click Generate New Array to create random data.

  2. Adjust Array Size and Animation Speed using sliders.

  3. Choose an algorithm from the dropdown list.

  4. Press Sort and watch how the algorithm works!