Spring MVC highlevel design for better performance and user experience

7:32 AM Hendry 0 Comments

This post is intended to discuss on enhancing Spring MVC so that it has better performance, and better user experience.
How to maximize performance and user experience? There are few things that could affect your web app performance and user experience. In my opinion for a better user experience, we should have "Let UI display first, content later". Asynchronously displaying content is the key to boost user experience. Suggestion is to use AngularJS to perform an asynchronous call


Here is my high-level design on my Spring MVC project

View represents your jsp files (html, css, javascript, jquery, and angular js ajax http.post)

Controller represents java files with @Controller and @RequestMapping and if required @RequestParam to accept input parameter from view

Model represents java files for your business object

Service represents java files for your business logic, and have direct access to Helper classes. This is where you set for example wsdl request parameters, and map response from WSDL java object to your POJO Model 

Helper represents java files that have direct access to WSDL to perform service call




AngularJs and Spring Integration

8:37 AM Hendry 0 Comments


The purpose of this tutorial is to perform an integration between AngularJs and Spring MVC and to demonstrate how easy to use AngularJs with Spring is.

Include AngularJS in Spring MVC Project


1. Download AngularJS https://angularjs.org/
2. Include AngularJS javascript files under your resources folder and jsp. See previous post


Try AngularJs!


Copy below codes on your jsp

<script src="<c:url value="/resources/libs/angularjs/1.3.14/angular.min.js" />"></script>
<body>

<div ng-app="">
  <p>Name : <input type="text" ng-model="name"></p>
  <h1>Hello {{name}}</h1>
</div>

</body>

http://www.w3schools.com/angular/tryit.asp?filename=try_ng_default

AngularJS Documentation


How to include resources files in JSP Spring MVC

4:24 AM Hendry 0 Comments



Configure the root resource folder in your dispatcher class (default servlet-context.xml)

  
  <resources mapping="/resources/**" location="/resources/" />

Add your resources file under "resources" folder



In your jsp file

1.      Add below code on the most top .jsp file
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

2.      Javascript
<script type="text/javascript" src="<c:url value="/resources/jquery/jquery-1.11.1.min.js" />"></script>

3.      CSS
<link href="<c:url value="/resources/form.css" />" rel="stylesheet"  type="text/css" />