https://github.com/kjsubodh/stationery-ecommerce-app

Stationery eCommerce App, similar to Scooboo
https://github.com/kjsubodh/stationery-ecommerce-app

css ecommerce ecommerce-website front-end-development frontend html5 javascript json mern reactjs webapp webapplication webdev webdev-project

Last synced: about 2 months ago
JSON representation

Stationery eCommerce App, similar to Scooboo

• Host: GitHub
• URL: https://github.com/kjsubodh/stationery-ecommerce-app
• Owner: KJSubodh
• Created: 2024-08-18T13:21:08.000Z (5 months ago)
• Default Branch: master
• Last Pushed: 2024-08-18T13:47:35.000Z (5 months ago)
• Last Synced: 2024-08-18T14:44:42.585Z (5 months ago)
• Topics: css, ecommerce, ecommerce-website, front-end-development, frontend, html5, javascript, json, mern, reactjs, webapp, webapplication, webdev, webdev-project
• Language: JavaScript
• Homepage:
• Size: 17.5 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
Stationery eCommerce App

This project is an eCommerce web application for stationery items, built using ReactJS and CSS for the frontend. It is a single-page application that allows users to browse various sections of stationery products, add items to their cart, and proceed to checkout. At checkout, a detailed invoice is generated, and users are provided with a (dummy) payment option.

Features

React Router: Implemented using react-router-dom for seamless navigation between different sections.

Product Sections: Users can select a section from the homepage and explore a variety of stationery items.

Data Management: Items are extracted from stored .json and .js files to display the available products in the eCommerce app.

Shopping Cart: Add, remove, or update the quantity of items in the cart.

Checkout and Invoice: Upon checkout, an invoice is generated with a summary of selected items, total cost, and a payment option (for demonstration purposes).

Print/Download Invoice: The final invoice can be printed or downloaded for the user's records.

Available Scripts

In the project directory, you can run:

npm start

Runs the app in development mode.

Open http://localhost:3000 to view it in your browser.

Home Page

![Stationery_Store](https://github.com/user-attachments/assets/5e19acd6-9a4d-4756-8076-e54bce78c646)

Notebooks Section

![Notebooks](https://github.com/user-attachments/assets/0457d56c-b37a-4ddc-8c60-7673c9000d20)

Writeables Section

![Pencils](https://github.com/user-attachments/assets/07b24614-2409-4592-b610-0ac17ab6ba51)

Artistic Collection

![Artistic](https://github.com/user-attachments/assets/a51e42d3-1b9e-412a-8aa6-c30be992703d)

Cart and Invoice

![cart](https://github.com/user-attachments/assets/c48e6dfc-a9a8-4b63-8ab8-2fa038dde784)

![invoice](https://github.com/user-attachments/assets/b8d7a161-5b11-488a-9a74-339c7d46158b)