Hepsiburada Case Cennet Boran

• Page design where products are listed, searched and filtered

🍄 Preview

Live previews -> Demo

⭐ Features

when the project runs;

• The products come in sequential order. You need to hover over the product you selected and add it to the cart.
• You can search for the product you want by using the search box.
• You must enter at least 2 characters for the search box to work.
• You can filter the brand and product you want from the filter menus on the left.
• You can use the filter menu on the left or the sort drop down on the right to sort.
• To remove the filter, click on the product you are filtering to remove it.
• To view the products on other pages, you can go to the next or previous page by clicking the pagination boxes on the face of the counter.
• You can view the products you have added to your cart by hovering over the cart box.
• To remove products from your cart, you need to click on the remove button in the cart.
• While removing the product from the cart, you will see a popup for control purposes. You can click the option you want.
• Your total products in the cart will appear above the cart box.
• You cannot add a product you have added to the cart again.

Technologies in the project;

Client

• React Js library used. - React
• Css and Scss are used. - Scss
• Context API used. - Context API
• Deployed on Netlify. - Netlify
• Docker ready. - Docker
• Test React Jest used. - Jest

📌Installation

1.Install NPM packages

npm install

2.Compiles and hot-reloads for development

npm start

3.Compiles and minifies for production

npm run build

4.Lints and fixes files

npm run lint

🐳 Deployment - With Docker

• To deploy this project run

  npm run dev - dockerfile

📎 Running Tests

To run tests, run the following command

  npm  test

(private repo olduğu için badge görünmeyebilir.)

Badges

Authors

• @cennetboran

Feedback

If you have any feedback, please reach out to us at [email protected]