Modern and interactive algorithm visualization platform. Sorting, searching, graph, tree algorithms and complexity analysis.
Comprehensive demo of the platform - sorting algorithms, speed control, pause/resume, keyboard shortcuts and more
- Bubble Sort - Simple comparison-based sorting
- Merge Sort - Divide and conquer approach
- Quick Sort - Pivot-based fast sorting
- Heap Sort - Using heap data structure
- Linear Search - Sequential search
- Binary Search - Binary search (for sorted arrays)
- Interpolation Search - Interpolation search
- Binary Search Tree (BST) - Binary search tree
- AVL Tree - Self-balancing tree
- Red-Black Tree - Red-black tree
- B-Tree - Multi-way tree
- DFS (Depth-First Search) - Depth-first search
- BFS (Breadth-First Search) - Breadth-first search
- Dijkstra's Algorithm - Shortest path algorithm
- A Algorithm* - Heuristic-based pathfinding
- Time Complexity visualization
- O(1), O(log n), O(n), O(n log n), O(n²), O(2ⁿ) comparison
- Interactive graph display
- Knapsack Problem - Knapsack problem
- DP vs Greedy comparison
- Optimal substructure analysis
- ⌨️ Keyboard Shortcuts (Space/Enter: Start, P: Pause, R: Reset, S: Shuffle)
- 📊 Real-time Progress Tracking
- 🔔 Toast Notifications for user-friendly feedback
- 🎨 Dark/Light Theme support
- 📱 Responsive Design
- ⚡ Error Handling and validation
- 🎯 Step-by-step visualization
- Frontend: Next.js 15, React 19, TypeScript
- Styling: Tailwind CSS, Shadcn/ui
- State Management: React Hooks, Context API
- Animations: CSS Transitions, Custom animations
- Icons: Lucide React
- Charts: Recharts (for complexity visualizations)
# Clone the repository
git clone https://github.com/omercsbn/algoviz-platform.git
cd algoviz-platform
# Install dependencies
npm install
# Start development server
npm run dev
# Open in browser: http://localhost:3000- Select from left menu the algorithm category you want
- Choose algorithm and adjust parameters
- Click Start button or use Space key
- Follow the visualization
- Control animation speed with speed settings
| Key | Function |
|---|---|
Space/Enter |
Start algorithm |
P |
Pause/Resume |
R |
Reset |
S |
Shuffle/Refresh |
This platform specifically provides learning in the following areas:
- Algorithm analysis and complexity theory
- Data structures and algorithms
- Time/Space complexity concepts
- Algorithm optimization
- Problem solving techniques
Live demo: Sorting algorithms, real-time visualization, speed control and interactive features
- Fork the project
- Create your feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is licensed under the MIT License.
Ömercan Sabun
- 🌐 Website: omercansabun.com
- 💼 LinkedIn: Ömercan Sabun
- 🐙 GitHub: @omercsbn
- 📧 Email: omercansabun@icloud.com
- Next.js team for the amazing framework
- Shadcn/ui for the beautiful component library
- Tailwind CSS for utility-first CSS
- Lucide for the icons
⭐ If you liked this project, don't forget to give it a star!