Live Demo: https://ramazantk3.github.io/Product-Filtering-Website/

Images are not shown due to the limitations of github pages.

Important Note!!!

This is my first experience with Tailwind.css so obviously I made this project by following a Youtube tutorial. But, I didn't copy a single line of code except svg files and the products array of objects (supposedly JSON objects coming from a database but hardcoded this time just to keep the project simple), instead I wrote every single line by myself to get myself familiar.

Soon, I'll make another similar project like this, uniquely made by me to show that I actually learned from the tutorial and didn't pretend I did by copying someone else's code. I'd share the link here,too when I finish that project.

Link for that project: https://github.com/Ramazantk3/Filter-Search-Webpage

What's Important In This Code?

• Styling is done by using Tailwind.css so there is no styles.css file but everything in the classes of html tags.

• This code contains advanced Javascript methods like forEach,map,trim,filter,document.createElement,appendChild,classList,contains and event listeners.

• This code contains DOM manipulation with JS.

• To change display, 'hidden' class of Tailwind.css added and removed.