Le but de ce TP est de réaliser une application web en utilisant le framework SpringBoot et le moteur de rendu Thymeleaf. Cette application gérera un ensemble d'événements. On pourra ainsi consulter la liste d'événement existant, en ajouter, en supprimer.
0- Créer un projet SpringBoot-Thymeleaf
- Utilisez spring initializr en ligne.
- Depuis intellij
- Ajoutez spring-web et thymeleaf en dépendance
1- Exposer une page
- Créez une classe controller, IndexController annoter de @Controller , dans un dossier controller situé au même niveau que votre Application
- Ajoutez une fonction public renvoyant une chaine de caractère et ayant comme paramètre un objet de type
Model
.
Cette fonction devra renvoyé une chaine de caractère correspondant au nom d'un fichier dans src/main/resources/templates (ie : return "toto"; signifie qu'il existe un fichier toto.html dans le dossier précédemment cité). - Annotez cette fonction avec une méthode de mapping. Vu que l'on souhaite récupérer une resource/page ce sera du GET, on utilisera donc l'annotation @GetMapping
- Créez ensuite le fichier html correspondant dans le dossier cité ci-dessus. Celui-ci devra contenir un message dans le body afin de garantir que cela fonctionne.
- Vous pourrez ensuite démarrer votre application afin de la tester. ./mvnw spring-boot:run
2- Enrichir la page en affichant un ensemble de données récupéré depuis notre serveur
- Créez un model, dans un dossier model se situant au même niveau que votre application, ajouter une classe Event . Celle ci représentera un événement : un identifiant unique, un nom et une date.
- Créez un context, dans un dossier context se situant au même niveau que votre application, ajouter une classe Context , annoté par @Component . Celle ci possèdera une liste d'événement, et les méthodes permettant d'enrichir votre liste : consultation, ajout, suppression.
- Dans le controller créé précédemment enrichissez la méthode en ajoutant au model un attribut events correspondant à la liste d'événement stocké dans votre context. Pour ce faire vous utiliserez la méthode model.addAttribute
- Complétez votre page html existante, afin d'afficher la liste des événements
- Pour finir ajouter un formulaire à votre page permettant l'ajout d'un événement.
<form class="form-ajout" th:action="@{/event}" th:object="${eventForm}" method="POST"> <label th:for="*{name}">Nom</label> <input type="text" th:field="*{name}" required/> <label th:for="*{date}">Date</label> <input type="date" th:field="*{date}" required/> <div class="action"> <a class="annuler-ajout" href="/">Annuler</a> <input class="valider-ajout" type="submit" value="Valider"/> </div> </form>
3- Ajouter une base de données
- Importer spring-data dans vos dépendances maven ainsi que H2.
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-data-jpa</artifactId> </dependency> <dependency> <groupId>com.h2database</groupId> <artifactId>h2</artifactId> <scope>runtime</scope> </dependency> - Compléter votre fichier de configuration
application.properties
spring.datasource.url=jdbc:h2:file:./data/demo spring.datasource.driverClassName=org.h2.Driver spring.datasource.username=sa spring.datasource.password=password spring.jpa.database-platform=org.hibernate.dialect.H2Dialect - Enrichissez votre model afin d'en faire un objet persisté, modifiez votre classe Event , ajoutez l'annotation @Entity
- Créez un dossier repository au même niveau que votre application. Y créer une interface EventRepository , annotée par @Repository . Celle ci devra étendre l'interface CrudRepository
- Vous devrez ensuite faire en sorte d'enrichir votre page html avec les données provenant de votre base de données.