:hibiscus: Perfume webstore

E-commerce project developed using Spring Boot and React.js.

An actual version of frontend build deployed to AWS S3 and backend deployed to Heroku:

http://perfume-web.tk
Login: [email protected]
Password: admin

Used Technologies:

• Back-end: Spring (Boot, Data, Security), JPA / Hibernate, PostgreSQL, JUnit, Mockito
• Front-end: TypeScript, React.js, Redux Toolkit, Ant Design, Jest
• Security: JWT, OAuth2 Google, Facebook, Github
• REST API, GraphQL API
• AWS S3, Heroku
• Server Build: Maven
• Client Build: npm, yarn, webpack

Features

• Authentication with JWT and Email validation.
• Authentication with Google, Facebook or Github
• Customers can search for the product according to the specified criteria.
• Customers can add and delete products from the shopping cart.
• Customers can order the products in the shopping cart.
• Customers can change their password and view their orders.
• Admin can add or modify a product.
• Admin can change the data of any user.
• Admin can view orders of all users.

Installation

1. Install maven: link
2. Install Java 8: link
3. Install Intellij IDEA Ultimate: link
4. Install Postgresql: link
5. Open pgAdmin and create a new DB (name: perfume and perfumetest) in Postgresql: link
6. Add Postgresql properties to the application.properties file: link
7. Add Lombok and GraphQL plugins to the Intellij IDEA (File/Settings/Plugins)
8. Register new AWS account: link
9. Create new S3 bucket: link
10. Change access from private to public in S3 bucket
11. Add public access policy to S3 bucket (!!!important!!! see: doc, github examle or my example)
12. Get AWS keys: link and add to the application.properties file: link
13. Register in gmail
14. Configure reCAPTCHA: link, guide, video guide (RUS)
15. Add reCAPTCHA key to the application.properties file: link and to link
16. Add gmail account and password to the application.properties file: link
17. Go to link (important) and change to: “Allow less secure apps: ON”
18. Configure OAuth2: link, guide, video guide (RUS)
19. Add OAuth2 properties to the application.properties file: link
20. Install node.js and npm: link
21. Now you can run EcommerceApplication (port 8080) and open terminal in client directory and type: npm start
22. Navigate to http://localhost:3000

Swagger Documentation

https://perfume-websore-api.herokuapp.com/swagger-ui.html
Or show local:
http://localhost:8080/swagger-ui.html

Screenshots

Menu page	Product page

Cart	Ordering

Email template	List of orders

User profile page	Add perfume page

Edit perfume list	Edit perfume page