4

I'm writing Java Web application and want to use AngularJS on frontend. But I don't want to delegate routing and security to angular, but handle it with spring. My file hierarchy in the project looks like that:

hierarchy

I wrote Angular controllers, services etc. And just apply it on the jsp page with some init parameters. All jsp are loaded by Spring controllers, I have some security rules for that pages. Angular also consumes REST API from this application.

The question is about efficiency of such approach. In fact I have a few SPA in here. Every time i load a page, Angular initializes from the beginning (there is about 10 pages).

The reasons I want to stay on this version are:

  • It's already set (Routing, Security)
  • It seems like I don't need to load all the scripts on the page, but only required ones

But also I have feeling I'm doing it wrong way... Should I separate Spring and Angular and use Angular also for routing and security handling, not only for DOM manipulation.

What do you think? Do you have any suggestion?

2
  • It seems you are not using Routing(using Spring), DOM manipulation(using jsps), so what is the use of angular, you might want to separate out the backend MVC from frontend MVC, and let them operate separately and get the benefit of both side's MVC architecture. Commented Nov 4, 2015 at 19:47
  • Well I decided to use Angular for DOM manipulations (such benefits as two way binding and AJAX queries to REST), but now I realized that Angular could be more then just these things. So I'm looking for the best practice of using Angular and Spring together Commented Nov 4, 2015 at 19:53

1 Answer 1

3

Angular is not another jQuery, its Single page application framework. You can look on SPAs like on ordinary external application which communicates with your backend. So there is no view or prezentation layer on server, just REST API.

Angular app should have its own routing, it doesn't make sense to combine it with spring MVC. Security lays mostly on REST, and you can use spring security on it as ussual.

Best practice is to create Angular app as separate javascript application. You can use a lot of tools from angular ecosystem which makes your work very comfortable.

During development you have your backend running, and develop Angular part separately using javascript devstack. After that you can pack the both parts to single war.

I have nice small example of Spring and Angular integration here:

https://github.com/Angular-cz/java-devstack

Unluckilly the readme is written in Czech (beautifull language :) But if you are experienced in Java and maven you will probably get it from code, I will also try to describe it here.

The bigger app with a nice module structure and jwt autentication can bee seen here: https://bitbucket.org/angular_cz/beerapp

Both of them has similar architecture:

  • separate maven module for frontend and separate for backend.
  • javascript part use npm as package manager
  • developer is using gulp task runner for javascript development (it is run inside module, where gulpfile.js resides).
  • there is karma runner configured and several unit tests
  • the app connects to the backend during development using proxy running on /api for the app can have same configuration on production)
  • when building war, frontend module uses frontend-maven-plugin which run gulp build task same as javascript developer would
  • then the built minified assets are put to resources
  • the next part is just ordinary maven way how to put assets to /static
  • one more nice thing - there is also integrated e2e test under integration-test profile.

Feel free to ask if you are interested in this kind of architecture.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.