Crear un proyecto base con Spring Boot y Vaadin (Spring Initializr)

Crear un proyecto base con Spring Boot y Vaadin

En este tutorial vamos a crear un proyecto demo con Spring Boot y Vaadin usando la forma estándar del ecosistema Spring: Spring Initializr.

Requisitos

• Java 21
• Maven 3.9 o superior
• Un IDE (IntelliJ, Eclipse o VS Code)

1. Crear el proyecto Spring Boot

Ingresamos al inicializador oficial de Spring:

https://start.spring.io

Seleccionamos las siguientes opciones:

• Project: Maven
• Language: Java
• Spring Boot: 4.0.1
• Group: com.example
• Artifact: demo
• Packaging: Jar
• Java: 21
• Dependencies: ninguna

Descargamos el ZIP y lo descomprimimos.

Spring Initializr es la forma estándar y recomendada para crear proyectos Spring Boot.

2. Abrir el proyecto

Abrimos la carpeta del proyecto en el IDE. Deberíamos ver una estructura mínima con un pom.xml y una clase principal.

3. Reemplazar el pom.xml para usar Vaadin

Abrimos el archivo pom.xml generado y reemplazamos todo su contenido por el siguiente:

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0
                             https://maven.apache.org/xsd/maven-4.0.0.xsd">

    <modelVersion>4.0.0</modelVersion>

    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>4.0.1</version>
        <relativePath/>
    </parent>

    <groupId>com.example</groupId>
    <artifactId>demo</artifactId>
    <version>0.0.1-SNAPSHOT</version>

    <properties>
        <java.version>21</java.version>
        <vaadin.version>25.0.2</vaadin.version>
    </properties>

    <dependencyManagement>
        <dependencies>
            <dependency>
                <groupId>com.vaadin</groupId>
                <artifactId>vaadin-bom</artifactId>
                <version>${vaadin.version}</version>
                <type>pom</type>
                <scope>import</scope>
            </dependency>
        </dependencies>
    </dependencyManagement>

    <dependencies>
        <dependency>
            <groupId>com.vaadin</groupId>
            <artifactId>vaadin</artifactId>
        </dependency>

        <dependency>
            <groupId>com.vaadin</groupId>
            <artifactId>vaadin-dev</artifactId>
            <optional>true</optional>
        </dependency>

        <dependency>
            <groupId>com.vaadin</groupId>
            <artifactId>vaadin-spring-boot-starter</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
    </dependencies>

    <build>
        <defaultGoal>spring-boot:run</defaultGoal>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>

            <plugin>
                <groupId>com.vaadin</groupId>
                <artifactId>vaadin-maven-plugin</artifactId>
                <version>${vaadin.version}</version>
                <executions>
                    <execution>
                        <goals>
                            <goal>build-frontend</goal>
                        </goals>
                    </execution>
                </executions>
            </plugin>
        </plugins>
    </build>

</project>

4. Verificar la clase principal

Spring Initializr ya creó la clase principal. No es necesario modificarla:

@SpringBootApplication
public class DemoApplication {

    public static void main(String[] args) {
        SpringApplication.run(DemoApplication.class, args);
    }
}

5. Crear la primera vista Vaadin

Creamos el paquete:

com.example.demo.views

Y dentro, el archivo MainView.java:

package com.example.demo.views;

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

@Route("")
public class MainView extends VerticalLayout {

    public MainView() {
        add(
            new H1("Hola Vaadin"),
            new Button("Probar", e ->
                Notification.show("Vaadin está funcionando")
            )
        );
    }
}

6. Ejecutar la aplicación

Desde la raíz del proyecto ejecutamos:

mvn spring-boot:run

Luego abrimos el navegador en:

http://localhost:8080

Si ves la pantalla con el título y el botón, el proyecto Spring Boot + Vaadin está funcionando correctamente.

7. Construir y ejecutar en producción

Para ejecutar la aplicación en modo producción, primero debemos generar el JAR con el frontend ya compilado.

mvn clean package

Esto genera un archivo JAR listo para producción en:

target/demo-0.0.1-SNAPSHOT.jar

Luego ejecutamos la aplicación:

java -jar target/demo-0.0.1-SNAPSHOT.jar

En los logs deberías ver una línea similar a:

Vaadin is running in production mode.

La aplicación está lista para ejecutarse en un servidor o entorno productivo sin configuraciones adicionales.

Conclusión

Usando Spring Initializr y una configuración limpia, tenemos un proyecto base con Spring Boot y Vaadin listo para crecer.