Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jely2002/pc-parts-webshop
A webshop for PC parts, coursework for the University of Applied Sciences Leiden
https://github.com/jely2002/pc-parts-webshop
Last synced: about 2 months ago
JSON representation
A webshop for PC parts, coursework for the University of Applied Sciences Leiden
- Host: GitHub
- URL: https://github.com/jely2002/pc-parts-webshop
- Owner: jely2002
- Created: 2022-01-21T19:30:13.000Z (almost 3 years ago)
- Default Branch: develop
- Last Pushed: 2022-05-20T17:05:03.000Z (over 2 years ago)
- Last Synced: 2024-05-02T00:53:27.298Z (8 months ago)
- Language: TypeScript
- Size: 7.56 MB
- Stars: 1
- Watchers: 3
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# PC Parts webshop
This is a simple webshop made in Angular and Spring Boot with JPA. As course work for the University of Applied Sciences Leiden.It has no order process, but contains product and product info management. As well as a working user authentication system and cart.
The webshop is styled using the material design principles.The database has been made as generic as possible, with almost everything being configurable.
Categories, products, product properties and more.## Technologies
### Front-end
- Angular
- Angular Material Design
- CSS3### Back-end
- Spring Boot
- MySQL
- JPA / Hibernate
- JSON Web Token## Build process
1. Database design
2. Front-end design
3. Back-end creation
4. Front-end creationTime spent: ~20 hours
## Run locally
To run this locally docker and NodeJS is required.The back-end can be started using the following commands (starting from root):
- `cd backend`
- `cp .env.example .env`
- `docker compose up --build`The front-end can be started using the following commands (starting from root):
- Change the environment.ts and environment.prod.ts to point their apiUrl to: `http://localhost:3000`.
- `cd frontend`
- `npm install`
- `npm run start`The front-end can then be found on `localhost:4200`.
## Screenshots
All screenshots except for the 'Profile' are made while logged in to an administrator account. Making the website show 'delete', 'add category' and 'add product' buttons.### Home / categories
The homepage that shows all the available categories.![categories](https://user-images.githubusercontent.com/20154900/169577519-a6594207-3039-487d-bdf1-17617cca6be1.png)
### Products
A list view of products belonging to a category with its price, description and properties.![products](https://user-images.githubusercontent.com/20154900/169577695-61ed3d71-a5ee-476c-aac1-9966fcb343c5.png)
### Cart
The cart, where amounts can be changed.![cart](https://user-images.githubusercontent.com/20154900/169577715-4db5048a-beea-492d-8238-e55091aef480.png)
### Profile
User profile, here a user can logout, delete their account or change details.![profile](https://user-images.githubusercontent.com/20154900/169577780-fb85286d-7153-4587-be8d-318c83acc01b.png)
## Datamodel
![datamodel](https://user-images.githubusercontent.com/20154900/169577852-f512c6a6-8305-46d4-9ed1-0f408e6a8c83.png)