Introduction
SPA is a multi-technology Open Source project that aims to provide fully working starter or reference projects for Single Page web Applications (SPA) that use REST-style web-services implemented on various middleware platforms.
Single Page Applications using JSON web-service APIs are the de facto standard used to develop responsive web applications for the modern web.
One of the main advantages of an SPA is to avoid full-page refreshes when switching from one page ("view") in the application to another. Traditional web applications had previously required a round-trip to the server for each interaction, with inherent and noticeable lag and obvious "flashes" when the page refreshes.
An SPA is generally a smoother user experience, trips to the sever to fetch data can be pushed to the background while maintaining a responsive non-blocking user interface.
Single Page Applications are generally implemented using a "reactive" development style and just about all interesting modern web development is done in some form of JavaScript (perhaps transpiled) in a client browser. Server-side templating technologies like JSP, JSF, Struts and so on are increasingly becoming dated and falling out of favour.
There are many other advantages to building applications this way, not least is the option to build a Progressive Web Application (PWA) that could even work offline and feel more like a native application.
Why?
Setting up SPA projects to work properly with some middle-tier frameworks can be very difficult and frustrating and can require specialist configuration.
Spring/SpringMVC especially is notorious for complex configuration and copious boilerplate.
An SPA also has particular routing requirements.
Routing is mainly a client-side solution after the initial page-load for the application, but nothing prevents a user from forcing a full-page refresh or bookmarking and returning to "deep" links in the application. These deep links require server-side routing to make sure the SPA initial page is loaded before client routing again takes over.
On top of this, web-service API calls and requests for static resources must also have proper routing configuration.
The necessary routing can be difficult to achieve properly.
This project aims to solve these initial project structure, configuration and routing requirements in a minimal and easy to comprehend set of template projects at Github.
Middle-tier Technologies
Spring and SpringMVC, while somewhat complex, bloated and long in the tooth, are still very popular frameworks for server-side Java developers.
Spring Boot, opinionated Spring. I heard you liked frameworks so we put a framework in your framework so you can framework while you framework - Spring, the framework so complex it needs another framework just to use it. To be fair, Spring Boot is easier than using SpringMVC directly.
Vert.x is a toolkit for building reactive applications on the JVM and has similarities with node. Vert.x was much easier to deal with than SpringMVC.
Javalin is a simple web framework for Java and Kotlin. This framework was the easiest and quickest to get up and running with, the server-side routing was particularly nice and simple.
Front-end Technologies
ReactJS is a massively popular JavaScript user interface library using a declarative component-based approach to development. The Github project has over 130,000 stars and is used in over 2 million Github projects. Out of all the supported front -end technologies, ReactJS undoubtedly feels the simplest and cleanest and nicest to use. ReactJS is just awesome.
AngularJS is another component-based user interface library that uses Typescript. It is somewhat more verbose and syntax-heavy than ReactJS and significantly more complex to learn and use. The Github project has almost 60,000 stars.
VueJS is a Javascript framework for building user interfaces on the web. The Github project has over 140,000 stars and is used by just over 900,000 Github projects.
EmberJS is a framework for "amibtious" web developers and aims to be "highy productive out of the box". The Github project has over 20,000 stars and is used by over 18,000 other Github projects.
Reference Projects
Java
Some of the reference projects are template projects available at our Github repository (there are too many combinations to include all of them):
Vert.x
SpringMVC
Spring Boot
Javalin
Kotlin
Javalin
Scala
Javalin
Other
A convenient link to all SPA projects.
The "HTML" versions are just vanilla projects without any front-end framework integrated and really aren't all that interesting, but they do show fully working routing.
Other variations may be added as time goes on.
Generate Your Own Projects
We created a Yeoman generator to create the various combinations of SPA projects.
Currently there are 128 possible project combinations, allowing you to mix any of these technologies...
Back-end Language
- Java
- Kotlin
- Scala
- Groovy
Back-end
- Spring Boot
- SpringMVC
- Javalin
- Vert.x
Front-end
- ReactJS
- AngularJS
- VueJS
- EmberJS
Front-end package manager
- Yarn
- npm
Where?
The generator project is available at the npm registry.