Sorting Visualizer with Sound (JavaScript Tutorial)

Published: 29 September 2022
on channel: Radu Mariescu-Istodor

27,526

865

This is part of a Sorting Tutorial Series I'm making. In this video You'll learn how to make a simple sorting visualizer which we'll improve to support sound as well. We create this application using basic HTML, CSS and vanilla JavaScript and we generate sounds using the Web Audio API.

⭐️LINKS⭐️

Visualizer I was inspired by:
   • Bubble Sort

Bubble Sort Wikipedia Page:
https://en.wikipedia.org/wiki/Bubble_...

My Visual Web Development (VWD) Course:
   • Visual Web Dev. Course (2021)

My Melody Maker Tutorial:
   • Melody Maker app using vanilla JavaSc...

My Interpolation Lesson:
   • Linear Interpolation (Lerp) - Math an...

My website: https://radufromfinland.com

⭐️ TABLE OF CONTENT ️⭐️

0:00 Intro
0:59 HTML Project Setup
2:25 Array with Random values
3:21 Visualizing the Array on the Webpage
8:27 Bubble Sort in JavaScript
9:51 Interface Controls
13:12 Animating the Swaps
26:13 Explaining Bubble Sort
28:22 Adding Sound using the WebAudioApi

On this page of the site you can watch the video online Sorting Visualizer with Sound (JavaScript Tutorial) with a duration of hours minute second in good quality, which was uploaded by the user Radu Mariescu-Istodor 29 September 2022, share the link with friends and acquaintances, this video has already been watched 27,526 times on youtube and it was liked by 865 viewers. Enjoy your viewing!

13,912

323