https://github.com/haminimi/e-commerce

An SPA E-Commerce site built with React.
https://github.com/haminimi/e-commerce

client-side-routing css-modules css-modules-react e-commerce e-commerce-project javascript react react-router react-testing-library rtl spa testing vitest

Last synced: 6 days ago
JSON representation

An SPA E-Commerce site built with React.

• Host: GitHub
• URL: https://github.com/haminimi/e-commerce
• Owner: Haminimi
• Created: 2024-01-23T13:36:10.000Z (10 months ago)
• Default Branch: main
• Last Pushed: 2024-05-22T12:59:53.000Z (6 months ago)
• Last Synced: 2024-05-22T13:59:32.152Z (6 months ago)
• Topics: client-side-routing, css-modules, css-modules-react, e-commerce, e-commerce-project, javascript, react, react-router, react-testing-library, rtl, spa, testing, vitest
• Language: JavaScript
• Homepage: https://e-commerce-nu-steel.vercel.app/
• Size: 8.49 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# E-Commerce Site 🛒

![Screenshot of the E-Commerce Site.](/screenshot.png)

## Description

An SPA E-Commerce site built with React. [The project](https://www.theodinproject.com/lessons/node-path-react-new-shopping-cart) is a part of [The Odin Project](https://www.theodinproject.com/dashboard)'s React course within [The Odin Project](https://www.theodinproject.com/dashboard)'s curriculum. The Odin Project provides a high quality web development education maintained by an open source community.

## [Live Preview](https://e-commerce-aus.pages.dev/)

## Main Features

- **SPA:** The app uses client-side routing with React Router.

- **Accessibility:** It is fully accessible and it respects various accessibility recommendations, such as including sufficient color contrasts, labeling, and keyboard support.

- **Responsive Design:** It provides a consistent user experience across various screen sizes.

- **Tested:** The project includes various tests that covers all of its components.

## Tech

**The project is built with:**

- React

- CSS Modules

**Tools**

- Visual Studio Code

- Git

- Vite

- Vitest

## Covered Topics

**This section mentions the main topics covered during project work and prior lessons**

- React Router

- Testing - Vitest and React Testing Library

- CSS Modules and styled-components

## Credits

- Icon used for the favicon image is one of the [Smart cart icons created by ChilliColor - Flaticon](https://www.flaticon.com/free-icons/smart-cart).

- Photo by [Artem Gavrysh](https://unsplash.com/@tmwd?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash) on [Unsplash](https://unsplash.com/photos/black-trike-parked-near-soter-F6-U5fGAOik?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash).

- [Fake Store API](https://fakestoreapi.com/).

## Happy coding!