Build a new Web Application from scratch using Spring boot, Thymeleaf, AngularJS – Part 3

In order to have angular injected into our HTML page we would need to do 2 things – – 1)Add the path of angular.min.js in our html file – – 2.

To see the data in the HTML, we need to do this : – – Upto this point we are just able to use angularJS in our static page and retrieve some information from backend Rest Controller and render it using AngularJS.

Now that we have got angularJS module inside our index page, lets implement the login/logout feature using Spring Security.

We will make a UserController with the following method : – – For Spring Security to work we need to add this in Application.java – – The “authenticated” variable is used to provide access on the pages.

Till now, we have successfully used Angular JS to login and logout using Spring Security.

In the previous blogs we built the landing page using Thymeleaf, Bower and Bootstrap and deployed it to Heroku.
In this blog we will introduce some functionality with AngularJS for front end and Spring Boot Webservices at backend.

@javacodegeeks:Build a new Web Application from scratch using #Spring boot, Thymeleaf, #AngularJS ��� Part 3

In the previous blogs we built the landing page using Thymeleaf, Bower and Bootstrap and deployed it to Heroku.

In this blog we will introduce some functionality with AngularJS for front end and Spring Boot Webservices at backend.

We will begin with Login/Logout section. Lets begin with installing AngularJS in our application using bower.

$ bower install angular –save

This will add angular dependencies inside the bower_components folder. In order to have angular injected into our HTML page we would need to do 2 things

1)Add the path of angular.min.js in our html file

2. Mark the body as ng-app=”myModule” ,which means we need to define a JavaScript module that Angular will recognise as an application called “myModule”. Angular module is like a container for the different parts of your app – controllers, services, filters, directives, etc.

Now we would need to define this module “myModule” in a JS file, we can call this file as app.js with constituents :