When our frontend gets a paginated result from an API, we have to handle not only paging, but also sorting of the outcome. In this post, I show how to create a custom sorting component that works well with a standard Page object returned by a Spring Boot API.
When pagination is performed on the backend side of a web application, we need to support this feature on the frontend. Read this post to see how you can easily handle Spring Boot Page object in an Angular app.
After adding the routing guards to your project, you need to unit test their methods to make sure that an unauthenticated user is correctly redirected to a “/login” path. Check out a sample test configuration and test cases that verify if the router always redirects users unmistakably.
There are several issues that need to be covered when you want to secure a frontend module of a Spring Boot and Angular app. Learn how to handle security based on JWT and enhance user experience with the AuthGuard functionality.
You can use the JSON Web Token standard as a part of your authentication and authorisation solution in a project built with Spring Boot and Angular. Check out this post to learn how to apply Spring Security, AuthGuard and JWT to your apps.
Check out how to build a side navigation that fits perfectly into an admin layout or any dashboard page. We are going to create a simple collapsible sidenav that can be easily integrated into any Angular project that uses Bootstrap.
Angular supports the decomposition of components by allowing you to include one into another. To test a component that contains other elements you have to declare them in the test configuration. Don’t forget about any @Input property of an aggregated component or running the test suite will result with the following error: Template parse errors: Can’t bind to property since it isn’t a known property of component
An Angular app is served by a different host than a Spring Boot API, so reaching for data via REST API will result in the following error: “Failed to load http://localhost:8080/api: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:4200’ is therefore not allowed access.” Read this post to learn how to configure Cross-origin resource sharing (CORS) to enable the cross-domain communication on a development environment.
In a multi module application Spring Boot should surrender routing control to Angular, otherwise trying to access any route other than the root page will result in a Whitelabel Error Page: “There was an unexpected error (type=Not Found, status=404)”
Check out the example of a multi-layout Angular application templates complemented with Bootstrap styles.