NoBackend in the Java World

Presentation by Jörg Herbst / 10m

What Technoloy do you use?

  • Applets
  • Server Side Java
  • Client Javascript
  • Groovy,Scala..
  • Rhino,Nashorn
  • Node.js IO.js

Jörg Herbst

Java since JDK 0.92

Professional since 2002

JavaScript since 2014

twitter:@terrible_herbst
github: terribleherbst

A word of warning

There is Backend

There is Frontend

The grass is alway greener...

Short round trips

None blocking IO with node

Present on low cost hosting

Deployment und compilation

Servlet API

Heavy application server

What Java has to offer

Great stable core libraries

Professional managed frameworks

Great virtual maschine

An awesome community

What happend before

  1. We don't need no JavaScript

  2. Extending Servlet based approach

  3. Compile JavaScript

  4. Java Backend - JavaScript Frontend

No Javascript

Poor useability

Slow interaction

Lots of roundtrips

Search engine visible

Extending Servlets

Better useabilty

Lots of roundtrips

Difficult to maintain

Search engine visible

Compile JavaScript

Better useabilty

Good interaction

Few roundtrips

Difficult beside the basics

Vendor lock in (GWT or Vaadin)

Java Backend - JavaScript Frontend

  • Javascript Frontend (i.e. AngularJS)
  • REST based JSON API
  • Java Backend (i.e. Ratpack.io)

The Challenge

Maintainable Frontend

Testable Code

Performance and Scalability

Vendor idependence

The world has changed

JavaScript is on every major site

There is Standard Comitee ECMA

There is npm as a Package Manager

There are build systems like Grunt

Testing frameworks exists Karma and Jasmine

Why AngularJS

  • Clear declarative code
  • Structure code with MVC
  • Testable
  • IDE Integration
  • Great tools and support

AngularJS






					

AngularJS


function BookListCtrl($scope, $http, $templateCache) {
   $scope.listBooks = function() {
 		$http({method: 'GET', url: './api/book', cache: $templateCache}).
 		success(function(data, status, headers, config) {
 	    	$scope.books = data;                  //set view model
 	    	$scope.view = './Partials/list.html'; //set to list view
 		}).
 		error(function(data, status, headers, config) {
 			$scope.books = data || "Request failed";
 			$scope.status = status;
 			$scope.view = './Partials/list.html';
 		});
  		}
}
BookListCtrl.$inject = ['$scope', '$http', '$templateCache'];

Testing with Karma


describe('myApp.view2 module', function() {

  beforeEach(module('myApp.view2'));

  describe('view2 controller', function(){

    it('should ....', inject(function($controller) {
      //spec body
      var view2Ctrl = $controller('View2Ctrl');
      expect(view2Ctrl).toBeDefined();
    }));

  });
});
Source: Angular Seed

Simple Karma Demo

A Java Backend

JVM ist more than Java

No more Pets in the store

Java Web is more than servlets

Ratpack

Async IO using netty

Fast roundtrip using groovy

Gradle for easy builds

Hystrix for managing micro services

Jackson for JSON

Not related to any type on Frontend

Simple Ratpack REST Demo

        handler("talk/:id") {
            def query = pathTokens["id"]
            byMethod {
                get {
                    render json (talks.find { talk -> talk.id = query})
                }
                put {
                    def talk = parse (fromJson(Talk))
                    talks.put(query,talk)
                }
                delete {
                    talks.remove(query)
                }
            }
        }                        
                    
Source: Ratpack REST

Conclusion

  • Development processes are language independent
  • Build a state of the art server side Java Application
  • Define a stable API
  • Use professional JavaScript at the client

Further Talks at JavaLand

  • Rapid Web Application Development with groovy Ratpack (Tue 2:00pm by Andrey Adamovich)
  • Robuste Anwendungen mit Hystrix (Wed 12:00am by Alexander Schartz)

Links

Optional Demo: Ratpack Books

Source: Ratpack with AngularJS