Spring MVC and Angularjs

Question

Currently I´m trying to learn Angular JS, but firstly I want to setup my environment with Spring mvc.

At the moment I only want to work with rest, but I have a doubt for what is the best way to place the resoucres in Spring MVC

My simple applicaction has this squeleton:

my-simple-app:
 src
   main
     java
     resources
   webapp
     resources
     WEB-INF

If I want to put the app folder from the angular-seed, what is the best place to put it?

I tried to put in src/webapp/resources/app but then I have to move the html files to WEB-INF?

How was your skeleton in your angular-js spring mvc applications?

What is the best way to do the redirect to the app/index.html? to the welcome file and then work only with angularjs $routeproviders?

Thanks!

Schlueter · Accepted Answer · 2014-10-02 15:42:05Z

8

As far as I can understand, your Front End technology is Angualar JS and your Back End technology is Spring MVC.

I'm a Front End developer and hence I can provide you the advice on the structure of your HTML, CSS, and Javascript.

Here are my recommendations:

Mode Of Communication Between Front End and Back End: JSON (Should be strictly followed for MVC Pattern)
File Location: All your Front End files should be in WEB-INF folder with this structure:
- WEB-INF/Assets: All your JavaScript Files, JavaScript Libraries, Images, CSS etc. Should Be Places Here. You Can Open A Separate Folder Each Resource Type Inside Assets
- WEB-INF/JSP: All Your JSPs should be placed here. As Angular's greatest strength is Single page Application, you can create one JSP per main page and place them here
- WEB-INF/HTML: All the static resources that would be injected into the JSPs using <ng-view>or <ng-include> can be placed here

Hope this helps!

edited Oct 2, 2014 at 15:42

Schlueter

4,1051 gold badge34 silver badges51 bronze badges

answered May 18, 2013 at 5:30

Abilash

6,0896 gold badges27 silver badges30 bronze badges

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

Comments

scothis · Accepted Answer · 2013-05-23 23:11:31Z

5

The easiest way to get going is to take all the files in the angular-seed/app directory and copy them into your src/main/webapp directory. After copying these files, you should be able to redeploy the app and have a running sample.

Most servlet containers will include index.html as a default welcome file. If yours doesn't, you can add that config in web.xml <welcome-file-list>.

The WEB-INF directory is for web resources that should not be exposed directly to the web. web.xml is a example of a file that should not be exposed to remote users. In this case, it's safe to expose all of the app's resources directly to the web; thus you don't need to place the resources under WEB-INF.

answered May 23, 2013 at 23:11

scothis

591 bronze badge

2 Comments

Daniel1979 Over a year ago

note though, if he uses spring MVC, and he has the spring-mvc dispatcher servlet mapped to /, this will hijack all requests :)

tgkprog Over a year ago

Also for a secure app dont want to expose all js and html which have business validations and front end flows and algorithms to the world. If under web-inf then only logged in / users with appropriate roles will be served those files

uzor · Accepted Answer · 2014-01-14 13:21:54Z

I recommend this structure for your project:

my-simple-app:
    src
        main
            java
                controller
                    MySpringCtr.java
                models
                    Person.java
                    House.java
                    *.java
        webapp
            WEB-INF
                resources
                    css
                        style.css
                        *.css
                    js
                        angularCtr.js
                        *.js
                pages
                    index.jsp
                    *.jsp
                mvc-dispatcher-servlet.xml
                web.xml

I found a tutorial for beginners which explains step by step how to combine SpringMVC and AngularJS, you can find the tutorial and the complete code in this blog I hope it will be useful :)

Collectives™ on Stack Overflow

Spring MVC and Angularjs

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related