Skip to content

This project is a SPA online store built on React using Redux Toolkit for state management, Axios for APIs, and React Hook Form for forms. The store has product filtering, a wishlist, a shopping cart, and a checkout page. It was deployed on GitHub Pages, and quality and performance were optimised with Web Vitals.

Notifications You must be signed in to change notification settings

Pro-100Evhen/kopitsia

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

43 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

This project is a modern online store built on the basis of React technologies. The project implements the functionality of a single-page application (SPA), which allows users to interact with the website continuously without the need to reload pages. Popular libraries and tools such as React, React DOM, and React Router DOM were used to build the interface, allowing users to navigate seamlessly between pages such as the homepage, category pages, shopping cart, and favourite products.

To make the user experience as comfortable as possible, the project uses additional components to display content loading (React Content Loader) and notifications (React Toastify), as well as to create product carousels (React Slick and Slick Carousel). Sass was used to style the interface, which allows you to effectively organise and structure styles.

The application state management is implemented with the help of Redux Toolkit and React Redux, which allows you to conveniently store and transfer the application state. Redux Persist is used to save the state between sessions, which is especially useful for saving the data of the shopping cart and the list of favourite products when you visit the site again. Forms, such as the order form or product filtering, are handled by the React Hook Form library, which provides convenient and efficient work with forms and validation.

Interaction with the server is carried out through the Axios library, which allows asynchronous requests to receive and send data, such as product information or order status. To test the project, we used the @testing-library/react, @testing-library/jest-dom, and @testing-library/user-event toolkits to ensure the stability and quality of the code through unit tests and integration tests.

The project is deployed on the gh-pages platform, which makes it easy to publish it online for further access and use. Web Vitals was used for performance monitoring, which helps to control the main metrics of speed and user interaction with the site, ensuring high quality and performance of the application.

Thanks to the use of this technology stack, the online store is fast, convenient and stable, providing users with a positive experience when shopping online.

About

This project is a SPA online store built on React using Redux Toolkit for state management, Axios for APIs, and React Hook Form for forms. The store has product filtering, a wishlist, a shopping cart, and a checkout page. It was deployed on GitHub Pages, and quality and performance were optimised with Web Vitals.

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published