REST API with Spring Boot and Angular
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
- Angular Extensions link
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.
- Install all the required dependencies:
npm install
- 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