crud-angular-spring icon indicating copy to clipboard operation
crud-angular-spring copied to clipboard

πŸ–₯ CRUD Angular + Spring demonstrating Has-Many relationship, including tests for the back-end and front-end

REST API with Spring Boot and Angular

CRUD Angular + Spring demonstrating Has-Many relationship, with tests.

πŸ’» Tecnologies

  • Java 17
  • Spring Boot 3
  • JPA + Hibernate
  • JUnit 5 + Mockito (back-end tests)
  • Maven
  • Angular v14
  • Angular Material
  • Karma + Jasmine (front-end tests)

⌨️ Editor / IDE

  • Visual Studio Code
  • Java Extensions link
  • Angular Extensions link

Some functionalies available in the API

  • βœ… Java model class with validation
  • βœ… JPA repository
  • [ ] JPA Pagination
  • βœ… Controller, Service and Repository layers
  • βœ… Has-Many relationship (Course-Lessons)
  • [ ] Swagger
  • βœ… Java 17 Records as DTO (Data Transfer Object)
  • βœ… Hibernate / Jakarta Validation
  • βœ… Unit tests for all layers (repository, service, controller)

Some functionalies available in the Front-end

  • [ ] Angular Material components
  • [ ] List of all courses
  • [ ] 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

❗️Excuting 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 depencencies:
npm install
  1. 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).