I have a SpringBoot Intializr project that consists of a Tech Shop using HTML and Bootstrap. However when I run it , I get a blank page. I have attempted to change the port , change the JDK version (previously had JDK 17 , now I have JDK 23) and also use another spring boot version (Used 3.1.0 , using 3.3.4) along with upgrading other dependencies but issue remains the same. There isn’t any error in server console or browser console while on the blank page and this issue also occurs if I run it on another computer or if I create a project using the same layout and index HTML , so I’m suspecting if it could be related to the paths but I’m unsure of the root cause. I will add some snippets of the code below
pom.xml
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>3.3.4</version>
<relativePath/>
</parent>
<groupId>Tienda</groupId>
<artifactId>demo</artifactId>
<version>0.0.1-SNAPSHOT</version>
<name>Tienda</name>
<description>Demo project for Spring Boot</description>
<url/>
<licenses>
<license/>
</licenses>
<developers>
<developer/>
</developers>
<scm>
<connection/>
<developerConnection/>
<tag/>
<url/>
</scm>
<properties>
<java.version>21</java.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-devtools</artifactId>
<scope>runtime</scope>
<optional>true</optional>
</dependency>
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<optional>true</optional>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>bootstrap</artifactId>
<version>5.3.1</version>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>font-awesome</artifactId>
<version>6.4.0</version>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>jquery</artifactId>
<version>3.7.0</version>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>popper.js</artifactId>
<version>2.11.7</version>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>webjars-locator</artifactId>
<version>0.47</version>
</dependency>
<dependency>
<groupId>com.mysql</groupId>
<artifactId>mysql-connector-j</artifactId>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-jpa</artifactId>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
<configuration>
<excludes>
<exclude>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
</exclude>
</excludes>
</configuration>
</plugin>
</plugins>
</build>
</project>
index html
<html xmlns:th="http://www.thymeleaf.org"
xmlns="http://www.w3.org/1999/xhtml">
<head th:replace="~{layout/plantilla :: head}">
<title>TechShop</title>
</head>
<body>
<header th:replace="~{layout/plantilla :: header}"/>
<footer th:replace="~{layout/plantilla :: footer}"/>
</body>
</html>
layout html
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head th:fragment="head">
<title>TechShop</title>
<meta charset="UTF-8"/>
<link th:href="@{/webjars/bootstrap/css/bootstrap.min.css}" rel="stylesheet"/>
<link th:href="@{/webjars/font-awesome/css/all.css}" rel="stylesheet"/>
<script th:src="@{/webjars/jquery/jquery.min.js}"></script>
<script th:src="@{/webjars/popper.js/umd/popper.min.js}"></script>
<script th:src="@{/webjars/bootstrap/js/bootstrap.min.js}"></script>
</head>
<body>
<header th:fragment="header" class="header">
<nav class="navbar navbar-expand-sm navbar-dark bg-dark p-0">
<div class="container">
<a th:href="@{/}" class="navbar-brand">[[#{aplicacion.titulo}]]</a>
<button class="navbar-toggler" data-bs-toggle="collapse" data-bs-target="#navbarCollapse">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-between" id="navbarCollapse">
<ul class="navbar-nav">
<li class="nav-item px-2"><a class="nav-menu-link nav-link" th:href="@{/categoria/listado}">[[#{plantilla.categorias}]]</a></li>
<li class="nav-item px-2"><a class="nav-menu-link nav-link" th:href="@{/producto/listado}">[[#{plantilla.productos}]]</a></li>
<li class="nav-item px-2"><a class="nav-menu-link nav-link" th:href="@{/usuario/listado}">[[#{plantilla.usuarios}]]</a></li>
</ul>
<div class="col-md-3">
<ul class="navbar-nav">
<li class="nav-item px-2"><a class="nav-link" th:href="@{/(lang=es)}">ES</a></li>
<li class="nav-item px-2"><a class="nav-link" th:href="@{/(lang=en)}">EN</a></li>
</ul>
</div>
</div>
</div>
</nav>
<section id="main-header" class="py-2 bg-success text-white">
<div class="container">
<div class="row">
<div class="col-md-6">
<h1><i class="fas fa-cog"></i> [[#{plantilla.suTienda}]]</h1>
</div>
</div>
</div>
</section>
</header>
<footer th:fragment="footer" class="bg-info text-white mt-5 p-2">
<div class="container">
<div class="col">
<p class="lead text-center">
© [[#{plantilla.derechos}]]
</p>
</div>
</div>
</footer>
</body>
You need to sign in to view this answers
