ReactJS-Spring-Boot-Full-Stack-App
This project consists of two applications: one is a Spring Boot Rest API called spring-backend and another is a ReactJS application called react-frontend.
Service-oriented platform focusing on establishing and maintaining connections between consumers and small businesses in the The Arts, Entertainment, and Recreation sector.
Click here to view the application. This application is subject to Copyright.
Applications
- spring-backend
Spring Boot Web Java backend application that exposes a REST API to manage hobbies. Its secured endpoints can just be accessed if an access token (JWT) is provided.
spring-backend stores its data in a MySql database.
spring-backend has the following endpoints
| Endpoint | Secured | Roles |
| POST /users/authenticate | NO | USER and BUSINESS |
POST /hobbies/create-offer {“name”,”slogan”, “category”, “intro”, “description”,”price”,”creator”,”location”,”profileImgUrl”,”galleryImgUrl1”, “galleryImgUrl2”,”galleryImgUrl3”, “contactInfo” } | YES | BUSINESS |
| DELETE /hobbies/delete-hobby/{sbdbId} | YES | BUSINESS |
| GET /user-home/{sbdbUsername} | YES | USER |
| GET /hobbies/hobby-details/{sbdbId} | YES | USER and BUSINESS |
| GET /hobbies/is-saved {“id”, “username”} | YES | USER |
| GET /hobbies/saved-hobbies/{sbdbUsername} | YES | USER |
| GET /business-owner/{sbdbUsername} | YES | BUSINESS |
| GET /hobbies/remove-hobby {“id”, “username”} | YES | USER |
| GET /hobbies/remove-hobby {“id”, “username”} | YES | USER |
PUT /hobbies/update-hobby {“name”,”slogan”, “category”, “intro”, “description”,”price”,”creator”,”location”,”profileImgUrl”,”galleryImgUrl1”, “galleryImgUrl2”,”galleryImgUrl3”, “contactInfo”, “id” } | YES | BUSINESS |
| POST /users/login/{sbdbUsername} | YES | USER and BUSINESS |
POST /test/results {“categoryOne”,” categoryTwo”, “categoryThree”, “ categoryFour”,” categoryFive”, “ categorySix”, “ categorySeven”, “location” } | YES | USER |
| POST /users/change-password {“email”} | NO | USER and BUSINESS |
| POST /users/change-password-new {“id”, “username”} | NO (link from Email) | USER and BUSINESS |
| POST /users/register-business {“username”,”businessname”, “address”, “email”,”password”, “repeatpassword”} | NO | BUSINESS |
| POST /users/rsignup {“username”,”fullName”, “gender”, “email”,”password”, “repeatpassword”} | NO | USER |
| GET users/show-business-details/{sbdbUsername} | YES | BUSINESS |
| DELETE users/delete-user/{sbdbId} | YES | USER and BUSINESS |
| PUT users/update-business {”businessname”, “address”,”password”, “id”} | YES | BUSINESS |
| PUT users/update-USER {,”fullName”, “gender”, ”password”, “id”} | YES | USER |
| GET users/show-client-details/{sbdbUsername} | YES | USER |
-react-frontend
ReactJS frontend application where users can find and save hobbies and businesses can manage offers. In order to access the application, user / business must login using his/her username and password. All the requests coming from react-frontend to secured endpoints in spring-backend have a access token (JWT) that is generated when user / business logs in.
react-frontend uses Semantic UI React as CSS-styled framework.
Prerequisites
-Java 11+
-npm
-JWT
Set up
Install NodeJs.
Frontend -
Open ./react-frontend
Install the modules - npm i
Start the application on local host - npm start
The application will run on http://localhost:4200
-React JS
-Axios - API Calls
Backend - Install JDK 11.0.11
Open ./spring-backend on any IDE (IntelliJ/Eclipse etc.) and run the application.
The backend will run on http://localhost:8080
-Spring Boot
-Basic Authentication and JWT implemented both using Spring Security.
-Spring Data JPA + MySQL
Database -
Make sure to specify spring.datasource.username and spring.datasource.password in the application.properties file. The databse will be created with the start of the application. No set up required.