[Feat] Add new category browsing page with search functionality

[kavya410004]

Description

I would like to propose to add a new web page that opens when the "Shop Now" button is clicked on the category card (as shown in the attached image). This page should allow users to browse through products in the selected category and provide a search bar to filter products by name or other attributes.

Current Functionality:

• The "Categories" section in the navigation bar displays details about each category in a container with a "Shop Now" button.
• Clicking the "Shop Now" button currently does not redirect users to a product browsing page.

Proposed Changes:

1. Create a new web page for each category, listing all available products in that category.
2. Add a search bar on the page to enable users to search through products by name, price, etc.
3. Display product details like name, image, price, and an "Add to Cart" button for each item.
4. Implement pagination or infinite scrolling if the product list is long.

This feature would improve the user experience by allowing them to explore products within specific categories and easily find what they are looking for via the search bar.

I would like to work on this issue, please assign this to me.

Screenshots

Checklist

• [X] I have checked the existing issues
• [X] I have read the Contributing Guidelines
• [X] I'm a GSSoC'24-Extd contributor
• [x] I'm a Hacktoberfest'24 contributor
• [X] I am willing to work on this issue (optional)

[kavya410004]

@mdazfar2 , could you please assign this issue to me? I can work on implementing this feature.

[github-actions[bot]]

Hello kavya410004! Thanks for opening an issue in Ezyshop! 🚀

We'll get back to you as soon as possible.

[mdazfar2]

@kavya410004 Thank you for raising an appropriate issue.

• You are assigned, and please try to add a dummy shop and dummy products that match the UI background, making it look professional and appealing.

[kavya410004]

@kavya410004 Thank you for raising an appropriate issue.

• You are assigned, and please try to add a dummy shop and dummy products that match the UI background, making it look professional and appealing.

Thank you for assigning me to this issue @mdazfar2 ! I’ll make sure to add a dummy shop and products that match the UI background.

Also, since I’ve registered for Hacktoberfest after raising this issue, would it be possible to add the relevant Hacktoberfest label to the issue now?

[mdazfar2]

Sure @kavya410004, I will be adding the Hacktoberfest label 🏷️.

[mdazfar2]

hey @kavya410004 I hope you are doing well!

• It has been 2 days and you haven't responded to anything. Thank you.

[kavya410004]

@mdazfar2 I am still working on this issue, would it be possible to give me some more time? I'd be thankful if you could.

[mdazfar2]

sure @kavya410004 i thought you were offline thank you for pinging me take your time.

[kavya410004]

Hi @mdazfar2

Is there a recommended limit on the number of dummy products I should add? I plan to store all the dummy products in a JavaScript array of objects.

[mdazfar2]

Okay @kavya410004, add whatever you want accordingly.

[mdazfar2]

Solved ☑️