Skip to content
Sven Ruppert edited this page Feb 25, 2018 · 6 revisions

Industrial Vaadin

In this workshop we will explore different ways, tools and techniques how we could start an industrial Vaadin project. So often you can read a "HelloWorld" but what will be happen if you need to start an industrial project?

There are a few things around Vaadin that are needed to work effective. We will go through a full project, step by step and mostly with Open Source.

The story

The story we are working on today will start with a few mocks. There is a database with a data set of customers. This should be displayed on screen in a table with a limited set of attributes.

_images/screen_mocks/Main_Screen.png

The view on the data set can be filtered by typing into a text field. To clear the filter, there is a button.

An additional button is needed to add a new customer. The attributes for a new customer is shown in the mock below with the name CustomerForm

_images/screen_mocks/CustomerForm.png

The CustomerForm should be visible, after

  • the button for a new customer is pressed
  • a data item in the table is selected and positioned on the right side of the screen.

_images/screen_mocks/Main_Screen_with_CustomerForm.png

After one of the buttons was clicked, the CustomerForm should be invisible.

  • save
  • delete
  • cancel

Additionally the CustomerForm should be invisible again, after the data item in the table was de-selected.

Here you can see the demo app, built with V8, in action.

_images/v08/Running_DemoApp.gif