Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/kjsubodh/gaming-pc-builder-
E-Commerce App for Gaming PC's selling and their accessories
https://github.com/kjsubodh/gaming-pc-builder-
babel css e-commerce ecommerce gaming html invoice-generator javascript jsx mern online-shopping-website react shopping-cart total-bill-calculation webapp webdev webdevelopment
Last synced: 25 days ago
JSON representation
E-Commerce App for Gaming PC's selling and their accessories
- Host: GitHub
- URL: https://github.com/kjsubodh/gaming-pc-builder-
- Owner: KJSubodh
- Created: 2024-06-28T13:11:56.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2024-06-28T13:58:30.000Z (4 months ago)
- Last Synced: 2024-09-29T02:40:46.030Z (about 1 month ago)
- Topics: babel, css, e-commerce, ecommerce, gaming, html, invoice-generator, javascript, jsx, mern, online-shopping-website, react, shopping-cart, total-bill-calculation, webapp, webdev, webdevelopment
- Language: JavaScript
- Homepage:
- Size: 11.6 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Gaming-PC-Builder
Hey Guys! A newbie here, trying to learn web development.
Overview
This is an e-commerce app made using React, HTML, and CSS ONLY (no backend yet). You can use this app to choose different parts to build your gaming PC and get the total cost in an invoice in INR (Indian Rupees).
Features
Build your own gaming PC by selecting various parts.
Buy individual gaming PC parts like GPU, CPU, Motherboard, etc.
Purchase pre-built gaming PCs.
Buy gaming accessories such as Mic, Earphones, Mice, Webcam, and Monitor.
Dummy payment options (non-functional).
Printable invoice/bill.Disclaimer
This project is an attempt to understand and learn web development better. Initially, I intended to implement the backend to make it a full MERN stack application, but due to time constraints, it’s front-end only.
Installation
Clone the repository:
git clone https://github.com/KJSubodh/Gaming-PC-Builder-.gitcd Gaming-PC-Builder-
Install dependencies:
npm installInstall Babel and other dev dependencies:
npm install --save-dev @babel/core @babel/cli @babel/preset-env @babel/preset-react
npm install --save-dev webpack webpack-cli webpack-dev-server babel-loader
Install React and React DOM:
npm install react react-dom
Start the development server:
npm start
Some Screenshots of the webapp
![Screenshot (81)](https://github.com/KJSubodh/Gaming-PC-Builder-/assets/56197566/aaaa18f0-6766-43db-9327-90c221c43a9a)
![Screenshot (80)](https://github.com/KJSubodh/Gaming-PC-Builder-/assets/56197566/4ed85aef-4368-45f1-810a-0b9fdbef2ac5)
![Screenshot (78)](https://github.com/KJSubodh/Gaming-PC-Builder-/assets/56197566/92407166-3608-4737-be63-5e9c7976241b)
![Screenshot (74)](https://github.com/KJSubodh/Gaming-PC-Builder-/assets/56197566/9089c547-0fca-42e8-bfe3-7e58d1339eda)
![Screenshot (73)](https://github.com/KJSubodh/Gaming-PC-Builder-/assets/56197566/a1c715f3-0031-4b48-b522-3b7c64689758)
![Screenshot (72)](https://github.com/KJSubodh/Gaming-PC-Builder-/assets/56197566/1eba1e9a-967d-4889-a8c2-f5b534975740)
![Screenshot (71)](https://github.com/KJSubodh/Gaming-PC-Builder-/assets/56197566/589be264-0b00-44c5-ab65-896804457240)
![Screenshot (70)](https://github.com/KJSubodh/Gaming-PC-Builder-/assets/56197566/5e4cb8f8-2142-4cba-beb7-a463cae7e9c9)
![Screenshot (69)](https://github.com/KJSubodh/Gaming-PC-Builder-/assets/56197566/41810322-bb87-420e-96dc-e90e485b22a7)