Creating modern java web applications based on struts2 and angularjs

Creating Modern Java Web
Applications Based on
and
ApacheCon: Core Europe 2015 by ( )Johannes Geppert @jogep

About me
Apache Member and Struts PMC Member
Software Developer @ 
Living and working in Leipzig

About Struts2
Action based Java
web framework
Built upon a
Request/Response
cycle
Clean architecture
Easy to extend
with plugins

Struts 2.5 is on the way!

Cleanup and Maintenance!
Switch to Java7
Increased Security with
SMI
xworkcore merged into
strutscore
Removal of deprecated
plugins
Dojo Plugin
Code Behind Plugin
JSF Plugin
Struts1 Plugin

Support for bean validation
Now as a (builtin) plugin available

Log4j2 as new Logging Layer
Replacement for Struts2
Logging Layer
Support for multiple
logging implementations
Better performance

Why AngularJS?
AngularJS is a structural framework for dynamic web apps.
It lets you use HTML as your template language and lets
you extend HTML's syntax to express your application's
components clearly and succinctly. Angular's data binding
and dependency injection eliminate much of the code you
would otherwise have to write. And it all happens within the
browser, making it an ideal partner with any server
technology.
https://docs.angularjs.org/guide/introduction

Google Trends
AngularJS, React, Backbone and ember.js
Blue line is the trend for AngularJS

Quickstart with Maven
Archetypes
mvn archetype:generate B
         DgroupId=com.mycompany.mysystem
         DartifactId=myWebApp
         DarchetypeGroupId=org.apache.struts
         DarchetypeArtifactId=struts2archetypeangularjs
         DarchetypeVersion=<CURRENT_STRUTS_VERSION>
         DremoteRepositories=http://struts.apache.org
cd myWebApp
mvn jetty:run
Open Browser http://localhost:8080

REST Based Actions
with Struts2 REST Plugin

REST Action Mapping
HTTP method URI Class.method Paramete
GET /order OrderController.index
GET /order/1 OrderController.show id="1"
POST /order OrderController.create
PUT /order/1 OrderController.update id="1"
DELETE /order/1 OrderController.destroy id="1"

Configure the REST Plugin
Add the rest plugin to the dependencies
<dependency>
<groupId>org.apache.struts</groupId>
<artifactId>struts2restplugin</artifactId>
<version>${struts2.version}</version>
</dependency>
Disable restrictToGET default behaviour
<constant name="struts.rest.content.restrictToGET" value="false"/>
Create packages for applications
<constant name="struts.convention.default.parent.package"
value="restangular"/>
<package name="restangular" extends="restdefault">
<defaultactionref name="index" />
</package>
<package name="data" extends="restangular" namespace="/data">
</package>

REST Content Type Handler
/order/1 or /order/1.action Dispatcher (e.g. JSP)
/order/1.xml XML Handler
/order/1.json JSON Handler
Easy to build e.g. for CSV result
Builtin Jackson support for JSON serialization
<bean type="org.apache.struts2.rest.handler.ContentTypeHandler"
        name="jackson"
        class="org.apache.struts2.rest.handler.JacksonLibHandler"/>
<constant name="struts.rest.handlerOverride.json"
        value="jackson"/>

Live Demo
https://github.com/apache/strutsexamples/tree/master/rest
angular

Custom Exception
Interceptor
protected String doIntercept(ActionInvocation actionInvocation)
                            throws Exception {
    try{
        return actionInvocation.invoke();
    } catch (Exception exception) {
        Map<String, Object> errors = new HashMap<>();
        HttpHeaders httpHeaders = new DefaultHttpHeaders()
            .disableCaching().withStatus(HttpServletResponse.SC_BAD_REQUEST)
                            .renderResult(Action.INPUT);
        if(exception instanceof SecurityException) {
            errors.put(ACTION_ERROR, "Operation not allowed!");
            httpHeaders.setStatus(HttpServletResponse.SC_FORBIDDEN);
        }  else { errors.put(ACTION_ERROR, exception.getMessage()); }
        return manager.handleResult(actionInvocation.getProxy().getConfig(),
                            httpHeaders, errors);
    }
}

Extend the Default
Interceptor Stack
<package name="data" extends="restangular" namespace="/data">
    <interceptors>
        <interceptor name="dataError"
            class="....ExceptionHandlerInterceptor"/>
        <interceptorstack name="dataDefaultStack">
            <interceptorref name="dataError"/>
            <interceptorref name="restDefaultStack"/>
        </interceptorstack>
    </interceptors>
    <defaultinterceptorref name="dataDefaultStack"/>
</package>

Dispatch an error event
Extend the generic _request method in DataService
$http(req).success(function(data) {
    def.resolve(data);
}).error(function(data, code) {
    def.reject(data);
    if(data.actionError) {
        $rootScope.$emit('dataerror', {  msg: data.actionError });
    }
});

Listen to error events
e.g in a Controller
$rootScope.$on('dataerror', function(event, alert) {
console.log(alert.msg);
});

Bean Validation
Client and Server side
New bean validation plugin

Specify a validation http status code
like "Not Acceptable"
<! Set validation failure status code >
<constant name="struts.rest.validationFailureStatusCode" value="406"/>

Change rest interceptor stack
Default validation interceptor is using the old validation
interceptor
Copy the rest default interceptor stack
Define the new one
<interceptor name="beanValidation"
class="....interceptor.BeanValidationInterceptor"/>
Replace the "validation" reference with "beanValidation"
reference in the stack

Where do we need it?
Frontend Validation Backend

Resource Bundles
Split them up!
<constant name="struts.custom.i18n.resources"
value="frontend,validation,exceptions"/>
Sample for validation messages
#validation_en.properties
validation.order.client = Client name can not be blank
validation.order.amount = Order amount needs to be between 10 and 666
#validation_de.properties
validation.order.client = Kunden Name darf nicht leer sein
validation.order.amount = Anzahl muss zwischen 10 und 666 sein

Language Controller
public class LanguageController extends RestActionSupport
    implements ModelDriven<Map<String, String>> {
    private Map<String, String> model;
    public String index() throws Exception {
        ResourceBundle bundle = getTexts("frontend");
        this.model = bundle.keySet().stream()
            .collect(Collectors.toMap(
                key > key, key > bundle::getString));
        return Action.SUCCESS;
    }
    public Map<String, String> getModel() { return model; }
}

Setup Angular Translate
(function() {
'use strict';
angular
.module('app', ['ngRoute', 'ui.bootstrap', 'pascalprecht.translate']);
})();
$translateProvider.registerAvailableLanguageKeys(['en', 'de']);
$translateProvider.fallbackLanguage('en');
$translateProvider.useUrlLoader('data/language.json', {
queryParameter: 'request_locale'
});
$translateProvider.determinePreferredLanguage();

With translate filter in templates
{{'order.client' | translate}}
In validation messages
@NotBlank(message = "validation.order.client")
@Min(value = 10, message = "validation.order.amount")
@Max(value = 666, message = "validation.order.amount")
In java code
throw new RuntimeException(getText("exception.not.supported"));

Thank you!
https://twitter.com/jogep

Resources

Apache Struts Project https://struts.apache.org
Struts2 Maven Archetypes https://struts.apache.org/docs/struts2mavenarchetypes.html
Struts2 Examples https://github.com/apache/strutsexamples
AngularJS https://angularjs.org
Angular Translate https://angulartranslate.github.io

Attributions
Leipzig Pictures by
by
by
by
by
by
by
Ruthe Cartoon by
by
by
by
by
by
Johannes Geppert
Model in the wind tunnel DLR German Aerospace Center
Road Nicola
Clean Up Allen Goldblatt
Beans Matthew
Matrix pills ThomasThomas
Shaking Hands Aaron Gilson
ruthe.de
Language Scramble Eric Andresen
Windows Box Perfection Rachel Kramer
Krakow Door John Finn
1949 Ford Coupe flat head V8 engine dave_7
Questions Alexander Henning Drachmann

Creating modern java web applications based on struts2 and angularjs

Recommended

More Related Content

What's hot (20)

Viewers also liked (20)

Similar to Creating modern java web applications based on struts2 and angularjs (20)

Recently uploaded (20)

Creating modern java web applications based on struts2 and angularjs