From 896a2d071a4e9989960cfebcaf1caa33b0543fce Mon Sep 17 00:00:00 2001 From: Binod Pant Date: Mon, 23 Jul 2018 17:00:30 -0400 Subject: [PATCH] PR for http://jira.baeldung.com/browse/BAEL-1947 Spring Boot Vue (#4687) * commit first as binodpanta * revert test change * A short example of real-time event streaming using Spring WebFlux * Code for http://jira.baeldung.com/browse/BAEL-1527 * remove unrelated files * Apply feedback changes to rename test and remove link from readme file, ongoing work * Update formatting fixes to code and add pom changes, that partially fix test runnning issues in IDE but not in cmdline * Apply Eclipse formatter to test code and apply suggested pom fixes * BAEL-1527 Formatting fix in pom.xml * Use string.format to cleanup logging code * BAEL-1527 Changed logging pattern * Start the spring-boot-vue module, WIP * some small updates with comments * Add index html template page * merge pom.xml fixes * Add integration test with MockMvc to verify index.html content is rendered correctly * fix up pom merge issues * merge issues fix for pom * pom end of file newline --- pom.xml | 4 +- spring-boot-vue/.gitignore | 25 +++++ spring-boot-vue/pom.xml | 56 ++++++++++ .../SpringBootMvcApplication.java | 13 +++ .../controllers/MainController.java | 18 ++++ .../src/main/resources/application.properties | 0 .../src/main/resources/static/favicon.ico | Bin 0 -> 15086 bytes .../src/main/resources/templates/index.html | 98 ++++++++++++++++++ .../SpringBootMvcApplicationTests.java | 35 +++++++ 9 files changed, 248 insertions(+), 1 deletion(-) create mode 100644 spring-boot-vue/.gitignore create mode 100644 spring-boot-vue/pom.xml create mode 100644 spring-boot-vue/src/main/java/com/baeldung/springbootmvc/SpringBootMvcApplication.java create mode 100644 spring-boot-vue/src/main/java/com/baeldung/springbootmvc/controllers/MainController.java create mode 100644 spring-boot-vue/src/main/resources/application.properties create mode 100644 spring-boot-vue/src/main/resources/static/favicon.ico create mode 100644 spring-boot-vue/src/main/resources/templates/index.html create mode 100644 spring-boot-vue/src/test/java/com/baeldung/springbootmvc/SpringBootMvcApplicationTests.java diff --git a/pom.xml b/pom.xml index f608f5cded..06ec82e5f0 100644 --- a/pom.xml +++ b/pom.xml @@ -422,6 +422,7 @@ spring-boot-persistence spring-boot-security spring-boot-mvc + spring-boot-vue spring-boot-logging-log4j2 spring-cloud-data-flow spring-cloud @@ -1223,4 +1224,5 @@ 3.8 - \ No newline at end of file + + diff --git a/spring-boot-vue/.gitignore b/spring-boot-vue/.gitignore new file mode 100644 index 0000000000..82eca336e3 --- /dev/null +++ b/spring-boot-vue/.gitignore @@ -0,0 +1,25 @@ +/target/ +!.mvn/wrapper/maven-wrapper.jar + +### STS ### +.apt_generated +.classpath +.factorypath +.project +.settings +.springBeans +.sts4-cache + +### IntelliJ IDEA ### +.idea +*.iws +*.iml +*.ipr + +### NetBeans ### +/nbproject/private/ +/build/ +/nbbuild/ +/dist/ +/nbdist/ +/.nb-gradle/ \ No newline at end of file diff --git a/spring-boot-vue/pom.xml b/spring-boot-vue/pom.xml new file mode 100644 index 0000000000..151fd293bb --- /dev/null +++ b/spring-boot-vue/pom.xml @@ -0,0 +1,56 @@ + + + 4.0.0 + + com.baeldung + spring-boot-vue + 0.0.1-SNAPSHOT + jar + + spring-boot-vue + Demo project for Spring Boot Vue project + + + org.springframework.boot + spring-boot-starter-parent + 2.0.2.RELEASE + + + + + UTF-8 + UTF-8 + 1.8 + + + + + org.springframework.boot + spring-boot-starter-web + + + + org.springframework.boot + spring-boot-starter-test + test + + + + + org.springframework.boot + spring-boot-starter-thymeleaf + + + + + + + org.springframework.boot + spring-boot-maven-plugin + + + + + + diff --git a/spring-boot-vue/src/main/java/com/baeldung/springbootmvc/SpringBootMvcApplication.java b/spring-boot-vue/src/main/java/com/baeldung/springbootmvc/SpringBootMvcApplication.java new file mode 100644 index 0000000000..c4213af0a3 --- /dev/null +++ b/spring-boot-vue/src/main/java/com/baeldung/springbootmvc/SpringBootMvcApplication.java @@ -0,0 +1,13 @@ +package com.baeldung.springbootmvc; + +import org.springframework.boot.SpringApplication; +import org.springframework.boot.autoconfigure.SpringBootApplication; +import org.springframework.web.servlet.config.annotation.EnableWebMvc; + +@SpringBootApplication +public class SpringBootMvcApplication { + + public static void main(String[] args) { + SpringApplication.run(SpringBootMvcApplication.class, args); + } +} diff --git a/spring-boot-vue/src/main/java/com/baeldung/springbootmvc/controllers/MainController.java b/spring-boot-vue/src/main/java/com/baeldung/springbootmvc/controllers/MainController.java new file mode 100644 index 0000000000..37b74876cf --- /dev/null +++ b/spring-boot-vue/src/main/java/com/baeldung/springbootmvc/controllers/MainController.java @@ -0,0 +1,18 @@ +package com.baeldung.springbootmvc.controllers; + +import org.springframework.stereotype.Controller; +import org.springframework.ui.Model; +import org.springframework.web.bind.annotation.RequestMapping; +import org.springframework.web.bind.annotation.RequestMethod; + +@Controller +public class MainController { + + @RequestMapping(value = "/", method = RequestMethod.GET) + public String index(Model model) { + // this attribute will be available in the view index.html as a thymeleaf variable + model.addAttribute("eventName", "FIFA 2018"); + // this just means render index.html from static/ area + return "index"; + } +} diff --git a/spring-boot-vue/src/main/resources/application.properties b/spring-boot-vue/src/main/resources/application.properties new file mode 100644 index 0000000000..e69de29bb2 diff --git a/spring-boot-vue/src/main/resources/static/favicon.ico b/spring-boot-vue/src/main/resources/static/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..64105ac11c6186e380a724416ceb77ab5c263fef GIT binary patch literal 15086 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 literal 0 HcmV?d00001 diff --git a/spring-boot-vue/src/main/resources/templates/index.html b/spring-boot-vue/src/main/resources/templates/index.html new file mode 100644 index 0000000000..9fa374282a --- /dev/null +++ b/spring-boot-vue/src/main/resources/templates/index.html @@ -0,0 +1,98 @@ + + + + + + + + + + + + + +
+

This is an example Vue.js application developed with Spring Boot

+

This file is rendered by a Spring built-in default controller for index.html (/) using + Spring's built-in + Thymeleaf templating engine. + Although we don't need it per se, we customized the information passed to this + view from thymeleaf by adding a controller method for "/" route to demonstrate how to pass information from + Thymeleaf to this page. + The combination of template engine and frontend framework like Vue can make this a powerful approach to build + more complex applications while leveraging the benefits of a framework like Vue.js. + You can use thymeleaf features too but this project focuses mainly on using Vue.js on the + frontend as the framework and makes minimal use of Thymeleaf. + Also we don't use any routing and multiple components in this example, so what you see is technically a + Single Page Application (SPA) without any routes configured. +

+ +
+
+ Name of Event: + +
+
+ +
    +
  • + + +
    • +
+
+
+
+ + + + + + + + \ No newline at end of file diff --git a/spring-boot-vue/src/test/java/com/baeldung/springbootmvc/SpringBootMvcApplicationTests.java b/spring-boot-vue/src/test/java/com/baeldung/springbootmvc/SpringBootMvcApplicationTests.java new file mode 100644 index 0000000000..6364351eb3 --- /dev/null +++ b/spring-boot-vue/src/test/java/com/baeldung/springbootmvc/SpringBootMvcApplicationTests.java @@ -0,0 +1,35 @@ +package com.baeldung.springbootmvc; + +import org.junit.Test; +import org.junit.runner.RunWith; +import org.springframework.beans.factory.annotation.Autowired; +import org.springframework.boot.test.autoconfigure.web.servlet.AutoConfigureMockMvc; +import org.springframework.boot.test.context.SpringBootTest; +import org.springframework.test.context.junit4.SpringRunner; +import org.springframework.test.web.servlet.MockMvc; +import org.springframework.test.web.servlet.result.MockMvcResultMatchers; + +import static org.hamcrest.CoreMatchers.containsString; +import static org.springframework.test.web.servlet.request.MockMvcRequestBuilders.get; +import static org.springframework.test.web.servlet.result.MockMvcResultMatchers.status; + +@RunWith(SpringRunner.class) +@SpringBootTest +@AutoConfigureMockMvc +public class SpringBootMvcApplicationTests { + + @Autowired + private MockMvc mockMvc; + + /** + * If this test passes, we got a page with the thymeleaf provided variable + * value for eventName + */ + @Test + public void shouldLoadCorrectIndexPage() throws Exception { + mockMvc.perform(get("/")).andExpect(status().isOk()). + andExpect(MockMvcResultMatchers.content() + .string(containsString("FIFA 2018"))); + } + +}