Skip to content


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?

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time

Spring Boot Hello World with Angular 2 and Webpack

Dependency Status devDependency Status

This repository is a seed for Spring Boot application with Angular 2 (AOT) client side.

The client side is based on the Angular2 AOT Webpack repository.


The application contains a simple REST service and a hello world app in the client side which calls the REST service on start.

The src/main/java directory is for the java source files.

src/main/web directory contains the source files for the client. There is an app/ directory for the Angular 2 app. The index.template.ejs is used for the index.html generation.

The src/main/reources directory is empty at the start. After the build it will contain the compiled bundles and the generated index.html for the client.


The webpack/webpack.env.js contains the configuration for the webpack.

    sourcePath: 'src/main/web',
    output: 'src/main/resources/static',
    appDirectory: 'app',
    backendUrl: 'http://localhost:8080',
    copyAssets: [
        {from: 'favicon.ico'},
        {from: 'assets', to: 'assets'}

sourcePath: the directory for the client side sources.
output: the directory for the generated files.
appDirectory: the Angular 2 app root in the sourcePath directory.
backendUrl: backend URL for the webpack dev server proxy.
copyAssets: copy-webpack-plugin configuration for the assets. If you need other assets along with bundles you can configure to copy those from the sourcePath.

How to develop

In the dev mode and in the build process too the index.html will created automatically based on the index.template.ejs file in the sourcePath directory. The webpack will insert the generated JS and CSS links.

npm start will start the webpack dev server. The webpack dev server serves the client from the src/main/web directory. The webpack is configured to proxy every request to the backend (except the index.html and the generated js/css files of course).

npm run build will create the AOT files and bundle the code for our client side. The bundle will be placed in the output directory for the Spring Boot. This directory is in the .gitignore because it will contain only generated files and will be cleared in every build so do not place sources there.

npm run ngc will create the AOT files.

npm run webpack will create the bundle without AOT.

npm run webpack-prod will create the bundle from AOT files.

The best method for developing is to concurrently start the spring boot application and the webpack dev server then open http://localhost:9000 in your browser.


If you want to change the sourcePath or the output directory then check the tsconfig.json and tsconfig.aot.json files too.


No description, website, or topics provided.







No releases published


No packages published