https://github.com/manishdevelops/e-commerce-product-page
an e-commerce product header page
https://github.com/manishdevelops/e-commerce-product-page
context-api react-router reactjs redux redux-toolkit tailwindcss
Last synced: about 1 year ago
JSON representation
an e-commerce product header page
- Host: GitHub
- URL: https://github.com/manishdevelops/e-commerce-product-page
- Owner: manishdevelops
- Created: 2023-05-21T11:10:34.000Z (about 3 years ago)
- Default Branch: master
- Last Pushed: 2023-05-24T17:18:12.000Z (about 3 years ago)
- Last Synced: 2025-01-18T04:43:48.280Z (over 1 year ago)
- Topics: context-api, react-router, reactjs, redux, redux-toolkit, tailwindcss
- Language: JavaScript
- Homepage: https://e-commerce-page-mkm.netlify.app/
- Size: 1.66 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Frontend Mentor - E-commerce product page solution
## Table of contents
- [Frontend Mentor - E-commerce product page solution](#frontend-mentor---e-commerce-product-page-solution)
- [Table of contents](#table-of-contents)
- [Overview](#overview)
- [The challenge](#the-challenge)
- [Screenshot](#screenshot)
- [Links](#links)
- [My process](#my-process)
- [Built with](#built-with)
- [Continued development](#continued-development)
- [Author](#author)
- [Acknowledgments](#acknowledgments)
## Overview
### The challenge
Users should be able to:
- View the optimal layout for the site depending on their device's screen size
- See hover states for all interactive elements on the page
- Open a lightbox gallery by clicking on the large product image
- Switch the large product image by clicking on the small thumbnail images
- Add items to the cart
- View the cart and remove items from it
### Screenshot
### Links
- Solution URL: [solution URL here](https://github.com/manishdevelops/e-commerce-product-page.git)
- Live Site URL: [live site URL here](https://e-commerce-page-mkm.netlify.app/)
## My process
### Built with
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- Mobile-first workflow
- [React](https://reactjs.org/) - JS library
- Tailwind - for styles
### Continued development
Looking forward to learn and enhance my experience on React and Tailwind etc by contributing to more and more projects
## Author
- Frontend Mentor - [@yourusername](https://www.frontendmentor.io/profile/manish-d-art)
- Twitter - [@yourusername](https://www.twitter.com/manishdevelops)
## Acknowledgments
Learned React and also got interest in Tailwind css from Namaste dev. I can't explain how mind blowing series was it. Before Learning React from Namaste dev I has a view on React that it's very vast Now I am able to know why I am writing a single line of code and can answer it.