Accessibility Now
Join our upcoming webinar about building accessible web applications! June 7, 2022.
Blog

Get started with Vaadin Start

By  
Mikael Sukoinen
Mikael Sukoinen
·
On Jul 22, 2021 2:17:03 PM
·
In Product

Vaadin Start

Vaadin Start is an online configurator for generating Vaadin web apps, fast. You can choose between Vaadin Flow (if you prefer Java) and Vaadin Fusion (if you prefer TypeScript), but don’t worry about making the wrong choice; the frameworks are interoperable and can be used independently or together in a hybrid app!

Go to start.vaadin.com if you would like to get started immediately.

Screenshot 2021-07-22 at 14.08.06

Figure 1: The "Hello World" view on Vaadin Start

What can I do with Vaadin Start?

Vaadin Start a visual tool for customizing and previewing a starter app before downloading it and importing it in your IDE. You can:

  • Add new views: Anything from an empty view or a credit card form to a map view or a CRUD view. Check out all the options in the VIEWS tab.
  • Create a custom theme: Change colors, typography, layout, and fonts to create a custom look.
  • Configure: Choose the Java and Vaadin versions, add optional Docker configuration, and set authorized roles for each view for increased security.
  • Preview and download: See how the app looks on different devices and then either download it directly to your local machine or publish the code to GitHub to start developing.

Screenshot 2021-07-22 at 10.45.28

Figure 2: A list of the available views.


NOTE: All the apps downloaded from start.vaadin.com use Spring Boot and Maven as the default technology stack. If you prefer another stack, please download a Java EE or plain Java project from the examples page instead. You can also find starters for OSGi and Gradle there.

Add Collaboration Engine

You can download a starter with Vaadin Collaboration Engine preinstalled. Collaboration Engine enables users to work simultaneously within the app, instantly, and without fear of conflicting edits. Collaboration Engine can be added with the “Collaborative Master-Detail” and “Discuss” views for Vaadin Flow apps.

Alternatively, use the Collaboration Engine preset.

Would you like to try a collaborative web app? Go to a demo app.

Add Pro Components

You can add a Dashboard, Grid and Rich Text Editor to your app in Vaadin Start. These are commercial Vaadin components in Pro+ subscriptions. You may activate a 14-day free trial if you don’t have a subscription yet.

Psst, we give free Pro subscriptions to students!

What's next?

Once you’ve got your Vaadin app, there is no limit to what you can do. However, we recommend joining our Discord community to talk with other Vaadin developers, and utilizing our free training to get certified for your Vaadin skills. 

Our technical documentation also provides tutorials and copy-paste examples for theming and deploying your app, etc.

Are there other ways to start a Vaadin project?

Yes. For example, you can download a skeleton starter directly from GitHub or use the experimental Vaadin Command Line Interface. However, you won’t be able to configure these applications before downloading them.

Is Vaadin Start free?

Yes. However, the commercial components require a professional subscription (or trial). Collaboration Engine is free for up to 20 users but requires a licence file for production.

Have you tried Vaadin Start yet? Is there something missing? Please, let us know by commenting below!

Mikael Sukoinen
Mikael Sukoinen
Mikael has a passion for writing text, code and music. He’s currently utilising his skills to explain difficult concepts in plain language at Vaadin Ltd.
Other posts by Mikael Sukoinen