CSLearn.JS is an javascript library mainly used for people who are learning or teaching computer science to create visual demos for certain data structures and algorithms. It will cover most common data stuctures like Array, Linked List, Tree, Queue, Stack and algorithms like Binary Search at first and add more data stuctures and algorithms later on. Users can interact with it by simply import the library and call the method to create certain data stuctures/algorithms. Also, user will be able to specify the style(size, color, speed of the gif of algorithm, etc) of the generated demo. It would be a great convinence for users to create computer science demo without duplicate work to generate it. To make it more creative and challenging, I decided that after user generating the demo in their HTML, the user can modify the data in place, meaning that they can change data stuctures like modify the value in the array , add a node to the tree, and pop item in Stack.
- First, download the data structures or algorithms folder you want to visualize and include that folder in your project.
- Second, include jQuery first and then include the downloaded CSLearn javascript file in the html.
- Finally, take a look at example page and API below to start learning/teaching CS.
here➡️ https://cslearn-js.herokuapp.com/