Question

I’m looking for effective approach to writing Java web app in Vaadin.
(several pages, a lot of tables, buttons..)

From what should I start ?

It’s good solution to begin from writing all needed components, layouts, panels and next merge all that to build single pages ?

or maybe it’s better to write every single page with no thinking about the entire project (of course, except changing pages), so for example: first I write login page (and all stuff I need for it), next I write admin page etc..

question concerns Vaadin, but it would be also fine to know, how it looks like in other Java web frameworks.

Answer 1

I am recently just got into Vaadin and this is the method I used to get my app off the ground.

First off check out the sampler application to get an idea of what is possible with Vaadin: Sampler

If you are using eclipse get the plug-in. Using the built-in “Install New software” function in Eclipse(Help -> Install new software) just type in the link and install the plugin: Eclipse Plugin

Use the plugin to create a basic vaadin project. Right-click in the Project explorer -> New -> Vaadin Project
Then go through the “1-hour” tutorial version on the site Tutorial

It will take you step by step into how to create a application and also will give you a basic structure by which to organize your project. Try to write as much as you can yourself and then look at the examples when you get stuck.

Layout in a nutshell:

At the most simple level you will have a vertical layout.

Then you will add a panels to this layout. A panel is similar to a div element. Add captions to panels. Use verticalLayout.setSpacing(true) to space out the elements in a layout.

Then you will add content to the panels such as a table for displaying data or a form or grid layout. Elements in the content such as a table can be linked to a container which is a datasource for a element.

Basic approach:

Create:

Layout(To organize elements) -> Elements to be placed in layout -> listeners for elements(To handle events like onClick) -> containers for elements that interact with data(To handle persistence and data population)

I’d say get one page working fairly well then expand out from there. Spend extra time learning how containers work.