Friday, April 6, 2018

Spring with Vaadin


Spring Boot is very good for implementing business logic and other back end operations. But the world is different if we want to present this data to the end-user in the form of GUI components. In that situation, Spring Boot will not help you a lot. And if you go on looking for GUI libraries, it is very challenging to find "the best" GUI library. Either you have to dive into web based technologies such as HTML, CSS and Javascript or have some libraries or frameworks totally different from Java (such as ReactJS or Angular). If we want to have one application and implement everything there including Business Logic, Model and Presentation, then, my opinion will be inegrate fantastic Vaadin Library into Spring Boot. That way, you are totally free to use the power of both frameworks. Cool right?

 Create Project

I create a gradle project which, for me, is comfortable, however, maven build can also be used. So, first of all create a new gradle project from Eclipse, then upgrade the gradle wrapper to the latest version(2.5.1 at this time). Then, you have to replace the contents of two files with the following:

i) settings.gradle

pluginManagement {
repositories {
maven { url '' }
maven { url '' }
resolutionStrategy {
eachPlugin {
if ( == 'org.springframework.boot') {
} = 'BACnetClocks'

ii) build.gradle
plugins {
id 'org.springframework.boot' version '2.2.0.M1'
id 'java'

apply plugin: 'io.spring.dependency-management'

group = 'com.example'
version = '0.0.1-SNAPSHOT'
sourceCompatibility = '1.8'

repositories {
maven { url '' }
maven { url '' }

ext {
set('vaadinVersion', '13.0.1')

dependencies {
implementation 'com.vaadin:vaadin-spring-boot-starter'
testImplementation 'org.springframework.boot:spring-boot-starter-test'

dependencyManagement {
imports {
mavenBom "com.vaadin:vaadin-bom:${vaadinVersion}"

After building, it downloads all the libraries. If we need extra libraries, we include here. 

Sample Example

There are a lot possibilies. But, I will create a very simple example which show a button in the browser, and the button responses with click.

1) Create a package, in source/main/java called 

2) This is top level package where we write Spring Boot application with the following information:
package com.kpaudel;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.scheduling.annotation.EnableScheduling;

public class BACnetApplication {
public static void main(String... args) {, args);

3) Create another pakcage called com.kpaduel.gui with the actual GUI component with the following contnets:

package com.kpaudel.gui;

import com.vaadin.flow.component.button.Button;
import com.vaadin.flow.component.notification.Notification;
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
import com.vaadin.flow.router.Route;

public class MainView extends VerticalLayout {


private static final long serialVersionUID = 1L;

public MainView() {
this.add(new Button("Click me", e->"Hrello SPring")));


Running Application

Running Spring Boot application is very easy, just runt the After running is complete, we can view the component through the following link:


Please have a look at the following link too, for more information.

No comments:

Post a Comment