https://github.com/fatihycan/product-list

https://github.com/fatihycan/product-list

html5 javascript module-scss react responsive-design scss

Last synced: about 1 month ago
JSON representation

• Host: GitHub
• URL: https://github.com/fatihycan/product-list
• Owner: FatihYcan
• Created: 2024-08-18T14:14:44.000Z (4 months ago)
• Default Branch: main
• Last Pushed: 2024-08-18T14:39:06.000Z (4 months ago)
• Last Synced: 2024-08-18T15:54:37.617Z (4 months ago)
• Topics: html5, javascript, module-scss, react, responsive-design, scss
• Language: JavaScript
• Homepage: https://fy-product-list.netlify.app/
• Size: 160 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Product List App

Product List App, a React application, is an application where products are listed and users can view and select products. This project was created using React and SCSS.

## Features

- **ProductsList**: Products are displayed by the `ProductsList` component. Each product includes price, title and image.

- **Categories**: Products can be filtered by categories displayed via the `HeaderH` component.

- **Hamburger Menu**: The hamburger menu, visible on small screens, allows users to quickly access categories.

- **Product Cards**: Products are displayed on cards that grow with the hover effect and add a shadow.

- **Responsive Design**: Using SCSS, the application is designed to adapt to different screen sizes.

## Technologies

- HTML5

- React

- SCSS

- Javascript

# Product List App

Bir React uygulaması olan Product List App, ürünlerin listelendiği ve kullanıcıların ürünleri görüntüleyip seçebileceği bir uygulamadır. Bu proje, React ve SCSS kullanılarak oluşturulmuştur.

## Özellikler

- **Ürün Listesi**: Ürünler, `ProductsList` bileşeni tarafından görüntülenir. Her ürün, fiyat, başlık ve resim içerir.

- **Kategoriler**: Ürünler, `HeaderH` bileşeni aracılığıyla görüntülenen kategorilerle filtrelenebilir.

- **Hamburger Menü**: Küçük ekranlarda görünür olan hamburger menü, kullanıcıların kategorilere hızlı erişim sağlamasına olanak tanır.

- **Ürün Kartları**: Ürünler, hover etkisiyle büyüyen ve gölge eklenen kartlarda gösterilir.

- **Responsive Tasarım**: SCSS kullanılarak, uygulama farklı ekran boyutlarına uyum sağlayacak şekilde tasarlanmıştır.

## Teknolojiler

- HTML5

- React

- SCSS

- Javascript

https://github.com/user-attachments/assets/0deb1dec-30d9-48aa-a295-bf0520d19a53

[Live](https://fy-product-list.netlify.app/)