<h2>About the project</h2>
<p>This is a platform which was developed using React and TailwindCSS. It was built to provide a visual way in a local web application how Linked Lists work.</p>
<p>It does not use any database or server, it is a simple React application, where preferences are stored in the browser's local storage.</p>
<h2>Functionalities</h2>
<h3>Creation of a Node</h3>
<p>To create a node, in the List Manager menu on the right, you can click on the "Add Node" button. Besides this, you can also press the key combination <code>CTRL</code> + <code>Y</code>. The button will be swapped with an input field where you can enter the value of the node. After you enter the value, you can press the "Add" button. The node will be added to the list.</p>
<p><img src="/portfolio-imgs/vll-node-creation.png" alt="VLL Node Creation"></p>
<h3>Creating Lists</h3>
<p>After generating a new node, hovering on the node itself on any of its sides will display a white circle. Clicking the white circle will generate an SVG arrow which can be used to connect nodes together. The arrow will be connected to the node you clicked on and you can drag it to another node to connect them.</p>
<p><img src="/portfolio-imgs/vll-live.gif" alt="Live VLL"></p>
<h3>Configuration Menu</h3>
<p>The configuration menu is used to configure various aspects of the nodes. Currently, you are able to select the type of address (real, simplified or integer), thus generating random addresses of the selected type for each node. Currently you cannot switch between singly or doubly linked lists, but this feature will be added in the future.</p>
<p><img src="/portfolio-imgs/vll-config.gif" alt="VLL Configuration"></p>

Visual Linked Lists

About the project

Functionalities

Creation of a Node

Creating Lists

Configuration Menu