Knapsack Visualizer(live link)

An Interactive Tool to Visualize 0/1 and Fractional Knapsack Solutions

A web-based interactive tool built with React, TypeScript, and Tailwind CSS, designed to visualize both 0/1 and fractional knapsack solutions. It allows users to input items with profits and weights, then calculates and displays optimal selections using dynamic programming and greedy algorithms.

challenge

Developing the Knapsack Visualizer came with several challenges, including efficiently managing state in React to ensure real-time UI updates as users interact with the application. Visualizing the 0/1 and fractional knapsack algorithms required designing an intuitive way to display tables, selected items, and profits without overwhelming users. Additionally, ensuring a fully responsive design with Tailwind CSS was crucial to provide a seamless experience across different screen sizes while maintaining a clean and structured layout.