Boot React

A starter application with spring boot and react
Alternatives To Boot React
Project NameStarsDownloadsRepos Using ThisPackages Using ThisMost Recent CommitTotal ReleasesLatest ReleaseOpen IssuesLicenseLanguage
React Spring25,3151,4641,3372 days ago363September 13, 202284mitTypeScript
✌️ A spring physics based React animation library
15 hours ago145agpl-3.0TypeScript
🚀🎉📚 APITable, an API-oriented low-code platform for building collaborative apps and better than all other Airtable open-source alternatives.
React Flip Toolkit3,67741412 months ago216September 04, 202247mitTypeScript
A lightweight magic-move library for configurable layout transitions
Spring Security React Ant Design Polls App1,617
23 days ago45Java
Full Stack Polls App built using Spring Boot, Spring Security, JWT, React, and Ant Design
Spring Boot React Oauth2 Social Login Demo1,133
23 days ago39Java
Spring Boot React OAuth2 Social Login with Google, Facebook, and Github
Ballcat1,011114 hours ago11August 11, 202114mitJava
😸一个快速开发脚手架,快速搭建企业级后台管理系统,并提供多种便捷starter进行功能扩展。主要功能包括前后台用户分离,菜单权限,数据权限,定时任务,访问日志,操作日志,异常日志,统一异常处理,XSS过滤,SQL防注入,国际化 等多种功能
74 years ago8September 11, 201810mitJavaScript
⚒ A react-spring driven masonry-like grid with enter/exit and shared element transitions
React Animated Tree7581243 years ago11December 13, 20189mitJavaScript
🌲Simple to use, configurable tree view with full support for drop-in animations
Tut React And Spring Data Rest744
2 years ago12JavaScript
React.js and Spring Data REST :: A tutorial based on the 5-part blog series by Greg Turnquist
Blog Tutorials640
a month ago46mitJava
:star: Codebase for various tutorials about Java, Spring Boot, AWS, Kotlin, and Testing
Alternatives To Boot React
Select To Compare

Alternative Project Comparisons

Spring boot and react hot starter

Build Status Windows build Status

Be more productive with this simple project that uses the spring dev tools and react transform for hot reloading.

Everything: backend, frontend and styles will be hot reloaded automatically.

See my article for an in-depth explanation.

This project also sets up spring security and spring-sessions, which will automatically store your sessions in Redis, allowing you to scale on multiple servers.

Both the frontend and the backend are fully tested.


The Java code is available in the backend sub-project. The frontend sub-project contains the javascript code.

In development you will have access to the awesome redux-dev-tools, which will allow you keep track of your application state and undo/redo every action at will.

The recommended way to launch the server is to use your favorite java IDE. The main method of the application is in the BootReactApplication class.

You will need node 6.0+ and yarn to run the dev server and build the project

The frontend dev server will be automatically launched when you start the backend.

I strongly recommend that you install yarn on your development machine.

To install download the dependencies needed by the frontend do:

cd frontend

If you do not have the required binaries on your machine, you can use ./gradlew frontend:yarn_install and ./gradlew frontend:start. Those two command will download the required node/yarn versions automatically and use them to run the node tasks.

Alternatives for running the projects

There is also a gradle task to run the spring server: ./gradlew bootRun.

Hot reloading

With the dev server running, saving your javascript files or stylus assets will automatically trigger the hot reloading (without browser refresh) of the application.

For the backend, recompiling the project in your IDE will trigger the reloading of the application’s class loader.


Sessions are stored in Redis with spring-sessions. Spring-sessions allows you to transparently persist the HttpSession on Redis. This allows to distribute the load on multiple servers if you choose to.

The application relies on a stateless REST api. When they authenticate, clients will be given a token. They will save this token in their local storage and send it as an HTTP header (x-auth-token). This allows the retrieval of the session data in Redis.

If you want to use a real redis, you can run the application with the redis profile.

If the redis profile is not active, your session will be stored in a map. See: EmbeddedSessionConfig. This is great in development but you should avoid it in production.


Profile description uses x-auth-token header?


Use a real redis connecting on localhost by default.


<none> (!redis)

Uses a map to store sessions


Active profiles

If your run your project with gradle, the system properties won’t be passed on to Spring. See this issue for workarounds.

The simplest way to go is to specify active profiles in your IDE.

Check out the doc to learn more about profiles in Spring Boot.

To run the jar in production mode use the following command:

java -jar boot-react-0.0.1-SNAPSHOT.jar                                                       16:57:01


The application is configured to work with Spring Security. It uses an in-memory authentication but you are free use other implementations or to roll your own.


This project uses Redux to handle state and actions. It is a simple library with very powerful dev tools.

Dan Abramov, the author of Redux, published a great Redux video tutorial.

I also suggest reading the redux quick start to understand how to architecture you application and the difference between containers and components.

Components are simple display elements that receive everything they need (state and actions) via props.

Containers are connected to Redux and as such, they can pull whatever properties they are interested in from the state and bind actions to dispatch. Those containers are only connecting simple components to Redux.

Small components are written using the stateless functional components syntax, i.e, those component are pure render components and only their props will have an impact on the DOM.

Beware, hot reloading is not supported on functional components yet (see this issue) unless they are wrapped in a real Component.

We can write tests on connected components, but it is more effective to test them in isolation from Redux.

Router push state

The project uses react-router to handle routes. You can choose several modes to handles the router history. By default, the project uses the browser history, which creates the nicest URLs (/login, /private, etc.).

In development, we use a dev server that proxies requests to the index.

In production, we have to use a special resource handler to redirect all non-asset requests to the index.

You can remove it if you choose to use memory history (no URL change) or hash history (/#/login, /#/private).


We use stylus as a css preprocessor. We also leverage two stylus modules:

  • nib, which provides interesting mixins

  • jeet, a powerful grid system

See examples of jeet here.

In development, the styles are included by webpack, which enables hot reloading. In production, we use the Extract Text Plugin to extract the css to a separate file.

Static assets

If you want to include static assets like images in the project, please see this issue, which explains how to use the URL loader.

I’m real bad at creating logos but if you have time, I would be happy to include this by default in the project.

Running the tests

The check tasks will run the tests in both the frontend and the backend:

./gradlew check

You can run the backend/frontend tests only with:

./gradlew backend/frontend:test

To test the backend, we use a simple library that wraps spring mvc tests and makes them a bit nicer to read. See the auth-spec for an example.

To test the frontend, we use enzyme.


This command will generate an optimized bundle and include it in the jar.

./gradlew clean assemble

The jar will be available in ./backend/build/libs/boot-react-0.0.1-SNAPSHOT.jar

You can then launch it with:

java -jar backend/build/libs/boot-react-0.0.1-SNAPSHOT.jar

In production, you should use a real Redis instance so, please uncomment and edit the configuration file (backend/src/main/resources/application.yml).

With spring boot 1.3, you can install the application as a linux service

NB: each application can be assembled with the assemble task so you can use frontend:assemble or backend:assemble. The backend task depends on the frontend task.


The project can create a docker container.

Just run:

./gradlew backend:buildDocker

And it will create a docker image named boot-react/boot-react.

> docker images
REPOSITORY                               TAG                 IMAGE ID            CREATED              VIRTUAL SIZE
boot-react/boot-react                    latest              5280d39f660f        About a minute ago   138.9 MB

You can then run it with:

docker run -p 8080:8080 boot-react/boot-react

You can also pass arguments to the application like this:

docker run -p 8080:8080 boot-react/boot-react


There is a simple docker-compose.yml in the root directory of the project. Once you have built the application image with ./gradlew backend:buildDocker, you can run:

docker-compose up -d

This will run the application together with a redis server.

Popular Spring Projects
Popular Reactjs Projects
Popular Frameworks Categories
Related Searches

Get A Weekly Email With Trending Projects For These Categories
No Spam. Unsubscribe easily at any time.
Spring Boot
Spring Session