Training Realm — progressive web app on Symfony and Angular

Training Realm offers unique fitness training routines. They asked us for an application for their users. Till now, training routines were posted as static pages and users had to calculate training days and remember results by themselves. The aim of the app was to make it easy for everyone to plan training days and progress automatically without having to remember about routines yourself.

Requirements gathering

We started the project with requirements gathering phase. This is the phase where we learn about clients plans and expectation. The better we know clients needs, the better we help in designing and implementation of the solutions. Quite often we can also help identify requirements which client did not take into account preventing surprises and unnecessary costs later on.

The Training Realm team already knew their users really well and had a really good understanding of what they wanted to build. Thanks to this, the phase of requirements gathering was really quick. One point that took a bit more time was an investigation into options of collecting payments and resulting tax implications. We did help them choose a payment’s provider who also helps with processing taxes when you collect payments from all over the world. was chosen because of their well-documented API and fast support.


After the requirements gathering phase, our design team created UX mockups outlining all the various screens and interactions.

Typically, we create UX mockups of all major screens and discuss them with the client. The focus is always put on the end user perspective. Depending on the types of users and their objectives and the websites or apps goals this process can be fairly simple or really complex. It can, for example, inlude test runs on a group of users to identify any potential unintuitive elements or blockers. For the main screens are the home screen and the training screen. This is where users spend the vast majority of their time and thus — this is where we put the most effort.

When the wireframes are ready, turning them into actual designs is a great experience, both for us and the clients. already runs a big fleed of websites. We had to make sure we stay within the schemes and colours of the brand, although we did modernize and extend it a little.


Symfony & Angular

After the design phase, it was “the build time”. We choose Symfony for the backend because of its speed and ease of implementation. Plus we love PHP so a framework based on PHP was a natural choice. requires a really slick frontend experience. To achieve it and keep the code manageable, we chose Angular for the frontend framework.

Progressive Web Application

Because the majority of users visit the app on mobile devices, responsive web design was critical and we meticulously tested the app on various devices and screen widths.
Also, to improve the experience of regular users we turned into a Progressive Web App (PWA). Users can save its icon on the home screen of their phones and tablets and use it just like a regular app. Visits from home screen icons amount not to 30% of all visits.

Continuous Integration

As usual, to make the build and testing easy, we used version control we set up continuous integration with the help of Jenkins and docker. Whenever a developer commits new code, an updated version of the application is staged on a testing server and automated tests verify whether everything works correctly. This is also great for clients who can see the progress of the work day by day and could easily help us bringing their input into the project.


The application is hosted on Amazon Web Services. It can quickly scale up and down depending on the number of users using it. Thanks to our continuous integration setup, new features can be deployed to it quickly and reliably without impacting the users.

Because apps users come from all over the world, our monitoring mechanisms ensure that the service runs smoothly 24/7.


The application was an MVP and proved to be a great success. Thousands of users create accounts on the service every month. New features and phases for the project are already being planned.

The client is thrilled and we are proud :)

To learn more check out our case study on the project

Originally published at




Enterprise websites built with best Open Source solutions. We are an Agile software development company. We create big websites with Drupal 8, Symfony and React

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

How to fix error in XAMPP apache in Windows

How to Set a Canonical URL in Go

Translate English to German Text with Deep Learning AI in C#

Image File Format Conversion API: How to Convert an Image to GIF Format using Java

While store pass short table.

Building a REST Client with Spring Cloud OpenFeign and Netflix Ribbon

A screenshot of the author adding the Spring Web, OpenFeign and Ribbon dependencies to his project.

Unity2D DevLog 14 — Randomizing Based on Rarity

Humans of DataHub: Fredrik Sannholm

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store


Enterprise websites built with best Open Source solutions. We are an Agile software development company. We create big websites with Drupal 8, Symfony and React

More from Medium

Angular vs React vs Vue: Which JS Front-end Technology is Best for You?

Is 2021 the end of AngularJS?

Angular: core.ts in detail

NPX — How to use multiple Angular projects with different versions