Skip to content

nicodewet/spring-boot-react-maven-starter

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Spring Boot React Maven Starter

A Spring Boot React Maven starter project without all the extra cruft and/or bulletproofing in source works, just the essence of what ties the applications together.

It is assumed the Spring Boot part is not new to you, all you want is a sensible starting point for a simple project that incorporates a React front-end with a Service Oriented Front-End Architecture (SOFEA).

So this project may help veteran Spring developers get their React jiggy on, with the intention being that you would follow along with this tutorial or just crack on with a new project.

  • Multi-module Maven build in a specific order (build client, then server).
  • React app in client directory.
  • Boot app in server directory.
  • Boot app configured to host client app.
  • server build uses maven-resources-plugin to copy across client app.

Note a key intention here was not to use Thymeleaf to serve the front-end as has been done in the Spring React.js and Spring Data REST tutorial.

Source works:

Getting Started

First Things First - Build & Run The Whole Thing

Use JDK 8 and Maven 3.

$ mvn clean install
$ java -jar server/target/server-0.0.1-SNAPSHOT.jar

Now open localhost:8080 in your browser.

What Ties It All Together?

In short multi-module Maven, Spring Boot magic and in particular these two plugins:

  • frontend-maven-plugin in the client module
  • maven-resources-plugin in the server module

Client Developer Hat On Mode

For an extremely quick start navigate to the client directory and execute the following:

$ yarn && yarn start

Having satisfied yourself that the client application runs, the next port of call would be getting familiar with the README.md in the client directory.

Note that rather than using TypeScript as was done in the good-beers tutorial we have used Javascript and adhere to the Airbnb React/JSX Style Guide.

Create React App

The client app was generated using Create React App as follows.

$ npm install -g create-react-app@2.1.3
$ npx create-react-app client

Server Developer Hat On Mode

Open the server directory in an IDE of your choice. This is a stock standard Spring Boot application.

In short the server-side exposes a good-beers endpoint that you can exercise as shown below, or you can just open localhost:8080/good-beers in your browser.

$ curl localhost:8080/good-beers

Help

Please file an issue on GitHub.

License

Apache 2.0, see LICENSE.

About

A multi-module Maven project that combines Spring Boot and React.js

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published