Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/loiane/crud-angular-spring
π₯ CRUD Angular + Spring demonstrating Has-Many relationship, including tests for the back-end and front-end
https://github.com/loiane/crud-angular-spring
angular angular-material angular-testing angularv17 angularv18 java spring spring-boot spring-mvc springboot springboot3 springframework
Last synced: 3 days ago
JSON representation
π₯ CRUD Angular + Spring demonstrating Has-Many relationship, including tests for the back-end and front-end
- Host: GitHub
- URL: https://github.com/loiane/crud-angular-spring
- Owner: loiane
- License: mit
- Created: 2022-05-30T23:09:48.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-12-15T21:44:23.000Z (7 days ago)
- Last Synced: 2024-12-15T22:26:42.090Z (7 days ago)
- Topics: angular, angular-material, angular-testing, angularv17, angularv18, java, spring, spring-boot, spring-mvc, springboot, springboot3, springframework
- Language: Java
- Homepage:
- Size: 8.48 MB
- Stars: 203
- Watchers: 6
- Forks: 37
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# REST API with Spring Boot and Angular
![Build](https://github.com/loiane/crud-angular-spring/actions/workflows/build.yml/badge.svg?branch=main)
CRUD Angular + Spring demonstrating Has-Many relationship, with tests.
This API is to showcase, especially for beginners, what a basic CRUD API that's close to being Production-ready looks like.
## π» Tecnologies
- Java 21
- Spring Boot 3 (Spring 6)
- Maven
- JPA + Hibernate
- MySQL
- JUnit 5 + Mockito (back-end tests)
- Angular v18
- Angular Material
- Karma + Jasmine (front-end tests)## β¨οΈ Editor / IDE
- Visual Studio Code
- Java Extensions [link](https://marketplace.visualstudio.com/items?itemName=loiane.java-spring-extension-pack)
- Angular Extensions [link](https://marketplace.visualstudio.com/items?itemName=loiane.angular-extension-pack)## Some functionalities available in the API
- β Java model class with validation
- β JPA repository
- β JPA Pagination
- β MySQL database (you can use any database of your preference)
- β Controller, Service, and Repository layers
- β Has-Many relationships (Course-Lessons)
- β Java 17 Records as DTO (Data Transfer Object)
- β Hibernate / Jakarta Validation
- β Unit tests for all layers (repository, service, controller)
- β Test coverage for tests
- β Spring Docs - Swagger (https://springdoc.org/v2/)### Not implemented (maybe in a future version)
- Security (Authorization and Authentication)
- Caching
- Data Compression
- Throttling e Rate-limiting
- Profiling the app
- Test Containers
- Docker Build## Some functionalities available in the front end
- β Angular Standalone components (Angular v16+)
- β Angular Material components
- β List of all courses with pagination
- β Form to update/create courses with lessons (has-many - FormArray)
- β View only screen
- β TypedForms (Angular v14+)
- β Presentational x Smart Components
- π§ Unit and Integration tests for components, services, pipes, guards## Screenshots
Main Page with Pagination
Form with One to Many (Course-Lessons)
View Page with YouTube Player
## βοΈExecuting the code locally
### Executing the back-end
You need to have Java and Maven installed and configured locally.
Open the `crud-spring` project in your favorite IDE as a Maven project and execute it as Spring Boot application.
### Executing the front-end
You need to have Node.js / NPM installed locally.
1. Install all the required dependencies:
```
npm install
```2. Execute the project:
```
npm run start
```This command will run the Angular project with a proxy to the Java server, without requiring CORS.
Open your browser and access **http://localhost:4200** (Angular default port).
#### Upgrading Angular
```
ng update
```Then
```
ng update @angular/cli @angular/core @angular/cdk @angular/material @angular/youtube-player --force
```