Internal World Cup 2018 prediction app
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

Prediction App

Simple web application which allows you to predict football matches during World Cup 2018 in Russia (and next events in the future).

Getting Started

Application will be available online (link soon). To run it locally, use docker script (soon).


For development, you need:

For front-end development you need to install at least @angular/cli @ 6.0.5. To do it, type in your console:

npm install -g @angular/cli@6.0.5

After that, go to the client folder nd install needed packages by install npm command:

cd client
npm install

To run front-end in development mode, just type:

ng serve

Client should be available on http://localhost:4200 address. Also, web client has a proxy in development mode which sends request to server on http://localhost:8080 address.

For back-end, you need to build gradle project. To do this, can go to the server folder in the main project folder. There, you can just run assemble gradle task.

cd server
./gradlew assemble

Before you run program in dev mode, you need to provide file with users. To do this, create users.csv file in /server/src/main/resources/db/changelog/samples folder. This file should looks like this:


You can also write a message to me. Maybe I will send you a valid file ;)

First line is mandatory. In the next lines, you can see other users. No passwords stored because authentication is based on external systems.

For development mode, this external system is...flag with configuration :). To set your user name which should be logged in in a development mode, go to /server/src/main/resources/application-dev-ms.yml and find property. Value of this property is a login of logged in user in development mode.

To run back-end in development mode (no change profile!), just type

./gradlew bootRun

Of course, you can use your IDE to do some things easier. Note that default profile is a dev-ms. To change it, go to /server/src/main/resources/application.yml and change property on name of your profile.

Server should be available on http://localhost:8080 address.


For now, we don't have production version. Instruction will be available after first release.

Running the tests

To run front-end unit tests, go to the client folder and run test ng task:

cd client
ng test

To run back-end unit tests, go to the server folder and run test gradle task:

cd server
./gradlew test

Coding style tests

For front-end, we use ESLint to verify our code. You need to configure linter for yourself with IDE to check continuously your code. If you want to check it from console, just type:

cd client
ng lint


For now, we don't have production version. Instruction will be available after first release.

Built With

  • Gradle - Back-end dependency management
  • npm - Front-end dependency management


We use SemVer for versioning. For the versions available, see the tags on this repository.


To do - 1.4.0

  • - FE - block buttons when request on modal is sent
  • - D - installation instruction
  • - BE/FE - admin panel, user modifications
  • - BE/FE - tests
  • - BE - CI/CD process
  • - I - license

Todo - 1.4.1

  • - FE - privacy policy etc
  • - FE/BE - messaging system to admin with restrictions

Done - 1.0.0

  • - BE - Database structure
  • - BE - Liquibase integration with database
  • - BE - security integration with waffle
  • - BE - match functionality, adding new, adding results
  • - BE - result functionality, calculating table, calculating match etc
  • - BE - type functionality, adding type by user
  • - BE - provided sample data
  • - FE - beautiful match card with match time, result, user points etc
  • - FE - front-end integration with security
  • - FE - nice loader :)
  • - BE - gradle build task for building front-end and copying files to jar + tests if it works ofc
  • - BE - introducing whole WC 2018 calendar
  • - BE - connection to mysql based on envs
  • - FE - case handling on match card (add type only if match has not started yet)
  • - FE - adding new match (only admin user)
  • - FE - adding match result (only admin user)
  • - FE - adding user type/prediction
  • - BE - logging configuration
  • - FE - whole ranking table
  • - FE - not found page
  • - FE - optimise ngfor

Done - 1.1.0

  • - BE/FE - fb oauth security
  • - BE/FE - AWS deployment
  • - BE/FE - admin dashboard/partially

Done - 1.1.1

  • - FE - responsive design
  • - FE - enter button actions
  • - FE - better closing modal behaviors

Done - 1.1.2

  • - FE - added ribbon in the match corner when typed is added by user

Done - 1.2.0

  • - FE - added ribbon with information when match is today and there is no type
  • - FE - added filter to today's matches only
  • - BE - added mail service with notification about today's matches

Done - 1.3.0

  • - BE/FE - added statistics panel