diff --git a/src/main/java/de/kebidge/middleware/frontend/MyRestController.java b/src/main/java/de/kebidge/middleware/frontend/MyRestController.java
new file mode 100644
index 0000000000000000000000000000000000000000..ba7f951a13ac0d23411121e05001c55c6c9af243
--- /dev/null
+++ b/src/main/java/de/kebidge/middleware/frontend/MyRestController.java
@@ -0,0 +1,26 @@
+package de.kebidge.middleware.frontend;
+
+import com.fasterxml.jackson.databind.JsonNode;
+
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+import org.springframework.web.reactive.function.client.WebClient;
+
+@RestController
+@RequestMapping("rest")
+public class MyRestController {
+
+ @GetMapping("/getItemAsJSON")
+ public String simpleCallJSON(){
+
+ return WebClient
+ .create("http://localhost:8181/shoppingItem/")
+ .get()
+ .retrieve()
+ .bodyToMono(JsonNode.class)
+ .block()
+ .toString();
+ }
+
+}
\ No newline at end of file
diff --git a/src/main/java/de/kebidge/middleware/frontend/ShoppingItem.java b/src/main/java/de/kebidge/middleware/frontend/ShoppingItem.java
new file mode 100644
index 0000000000000000000000000000000000000000..885657b07a2ac633ebaa246e3e222ab3261d3fb0
--- /dev/null
+++ b/src/main/java/de/kebidge/middleware/frontend/ShoppingItem.java
@@ -0,0 +1,11 @@
+package de.kebidge.middleware.frontend;
+
+import java.io.Serializable;
+
+public class ShoppingItem implements Serializable {
+
+ public long id;
+ public String item;
+ public int amount;
+
+}
\ No newline at end of file
diff --git a/src/main/java/de/kebidge/middleware/frontend/ThymeleafController.java b/src/main/java/de/kebidge/middleware/frontend/ThymeleafController.java
new file mode 100644
index 0000000000000000000000000000000000000000..17216ae980ab0ee40acc3ef88793af1296048550
--- /dev/null
+++ b/src/main/java/de/kebidge/middleware/frontend/ThymeleafController.java
@@ -0,0 +1,94 @@
+package de.kebidge.middleware.frontend;
+
+import org.springframework.beans.factory.annotation.Value;
+import org.springframework.stereotype.Controller;
+import org.springframework.ui.Model;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestParam;
+import org.springframework.web.reactive.function.client.WebClient;
+
+import reactor.core.publisher.Mono;
+
+@Controller
+public class ThymeleafController {
+
+ @Value("${welcome.user}")
+ private String user;
+
+ @Value("${shoppingitem.endpoint}")
+ private String shoppingItemEndpoint;
+
+ @GetMapping("/")
+ public String displayPage(Model model) {
+
+ ShoppingItem[] items = WebClient
+ .create(shoppingItemEndpoint)
+ .get()
+ .retrieve()
+ .bodyToMono(ShoppingItem[].class)
+ .block();
+
+ model.addAttribute("user", user);
+ model.addAttribute("items", items);
+ return "page";
+ }
+
+ @PostMapping("/")
+ public String addItem(@RequestParam String newitem, @RequestParam int amount, Model model) {
+
+ ShoppingItem item = new ShoppingItem();
+ item.item = newitem;
+ item.amount = amount;
+
+ WebClient
+ .create(shoppingItemEndpoint + "add")
+ .post()
+ .body(Mono.just(item), ShoppingItem.class)
+ .retrieve()
+ .bodyToMono(ShoppingItem.class)
+ .block();
+
+ return "redirect:/";
+ }
+
+ @PostMapping("/delete")
+ public String deleteItem(@RequestParam String item, Model model) {
+
+ WebClient
+ .create(shoppingItemEndpoint + "del-item/" + item)
+ .delete()
+ .retrieve()
+ .bodyToMono(Void.class) // dont expect a response
+ .block();
+
+ return "redirect:/";
+ }
+
+ @PostMapping("/delete-all")
+ public String deleteItemById(@RequestParam Long id, Model model) {
+
+ WebClient
+ .create(shoppingItemEndpoint + "del-id/" + id)
+ .delete()
+ .retrieve()
+ .bodyToMono(Void.class) // dont expect a response
+ .block();
+
+ return "redirect:/";
+ }
+
+ @PostMapping("/delete-list")
+ public String deleteItemList(Model model) {
+
+ WebClient
+ .create(shoppingItemEndpoint + "del-all")
+ .delete()
+ .retrieve()
+ .bodyToMono(Void.class) // dont expect a response
+ .block();
+
+ return "redirect:/";
+ }
+
+}
\ No newline at end of file
diff --git a/src/main/resources/META-INF/additional-spring-configuration-metadata.json b/src/main/resources/META-INF/additional-spring-configuration-metadata.json
new file mode 100644
index 0000000000000000000000000000000000000000..403fa08aeb1576bfd474357a387a80c86b442ccc
--- /dev/null
+++ b/src/main/resources/META-INF/additional-spring-configuration-metadata.json
@@ -0,0 +1,12 @@
+{"properties": [
+ {
+ "name": "welcome.user",
+ "type": "java.lang.String",
+ "description": "ShoppingApp User"
+ },
+ {
+ "name": "shoppingitem.endpoint",
+ "type": "java.lang.String",
+ "description": "Shopping Item REST Endpoint"
+ }
+]}
\ No newline at end of file
diff --git a/src/main/resources/application.properties b/src/main/resources/application.properties
index 8b137891791fe96927ad78e64b0aad7bded08bdc..7600fd0ec7ff55c40f89f8cd58dc3f4b157d56ab 100644
--- a/src/main/resources/application.properties
+++ b/src/main/resources/application.properties
@@ -1 +1,4 @@
+server.port=8282
+welcome.user=Kebidge
+shoppingitem.endpoint=http://localhost:8181/shoppingItem/
\ No newline at end of file
diff --git a/src/main/resources/static/style.css b/src/main/resources/static/style.css
new file mode 100644
index 0000000000000000000000000000000000000000..af7d4ac6bee99a5a2fa4697329dc32c1d4aa2b62
--- /dev/null
+++ b/src/main/resources/static/style.css
@@ -0,0 +1,67 @@
+body {
+ margin: 0;
+ padding: 0;
+ font-family: Avenir, Helvetica, Arial, sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ background-color: #27292d;
+ color: #fff;
+ }
+ body {
+ max-width: 600px;
+ margin-left: auto;
+ margin-right: auto;
+ padding: 50px;
+ }
+ table {
+ text-align: center;
+ }
+ th {
+ width: 200px;
+ }
+ body h1 {
+ font-weight: 700;
+ font-size: 28px;
+ text-align: center;
+ }
+ body form {
+ display: flex;
+ flex-direction: column;
+ width: 100%;
+ }
+ body form label {
+ font-size: 14px;
+ font-weight: 700;
+ }
+ body form button,
+ body form input {
+ height: 36px;
+ box-shadow:hsla(0, 0%, 100%, 0.35);
+ outline: none;
+ padding-left: 12px;
+ padding-right: 12px;
+ border-radius: 6px;
+ font-size: 18px;
+ margin-top: 6px;
+ margin-bottom: 12px;
+ }
+ body form input {
+ background-color: transparent;
+ border: 2px solid hsla(0, 0%, 100%, 0.35);
+ color: inherit;
+ }
+ body button {
+ cursor: pointer;
+ background-color: #a0a4d9;
+ border: 1px solid #a0a4d9;
+ color: #1f2023;
+ font-weight: 700;
+ outline: none;
+ border-radius: 6px;
+ width: 100px;
+ }
+ body h2 {
+ font-size: 22px;
+ border-bottom: 2px solid hsla(0, 0%, 100%, 0.35);
+ padding-bottom: 6px;
+ }
\ No newline at end of file
diff --git a/src/main/resources/templates/page.html b/src/main/resources/templates/page.html
new file mode 100644
index 0000000000000000000000000000000000000000..3a93413af715130cd332611e8a7d6f9bd5677241
--- /dev/null
+++ b/src/main/resources/templates/page.html
@@ -0,0 +1,67 @@
+
+
+
+
+ ShoppingApp
+
+
+
+
+
+
+
+
+
Shopping List
+
+
+
+
+
+
+
+
+
+ | ID |
+ Name |
+ Amount |
+ Delete |
+ Delete All |
+
+
+ |
+ |
+ |
+
+
+ |
+
+
+ |
+
+
+
+
Your list is empty! Add items to your shopping list...
+
+
+
+
+
+
\ No newline at end of file