A team of skilled developers and table football enthusiasts wanted to take it to the next level. The result is an amazing Progressive Web App that enables "Foosball" players from all over the globe to create leagues of their own, invite opponents, and play to rule the rankings.
Office League is an open source enthusiast driven project. It is also available as a free service hosted in the Enonic Cloud on https://officeleague.rocks - for anyone to join in on the fun. The app is used on a daily basis by organizations such as Redhat, Salesforce, and even Enonic. The most active leagues have 1000+ played games at the time of writing.
With limited resources, little time, and complex requirements - the team had little room for error and needed to use tools that would get them to the goal fast and efficiently.
The team had previously built a prototype, but the fact that the "Office League" would be public and open to anyone added further to the complexity. Here are some of the requirements for the app:
A core element of the solution is recording the games while playing, so it must work well on mobile devices. However, the team had little experience with native apps compared to web technologies. The team recently discovered Progressive Web Apps (PWA). New web standards and browser capabilities enable developers to create web-based applications that work and feel like native apps.
Progressive Web Apps (much like native apps) consist of a front-end and back-end. For the front-end, after researching available frameworks, the team concluded on using Angular 2 - a popular Javascript framework made by Google. To communicate with the server, the team wanted to explore a new technology called GraphQL, which supposedly would give front-end developer greater flexibility in fetching data from the server. Finally, Enonic XP was the perfect fit for the project:
Within few weeks, most of the back-end and API's were in place, and not surprisingly, most of the remaining time was spent building, tweaking and styling the application front-end.
Within days of launching, Office League was in daily use internationally. At the time of writing, hundreds of teams and leagues have been created. New developers have joined the open source project and the team was already planning new functionality and expanding to other sports as well.
"The only issue we really had to worry with was to make sure the app would work fine on iOS" says Glenn Ricaud - office league developer. This is perhaps a surprise, but iOS and Safari are at the moment lagging behind their rivals at Google. However, as Apple has now started adding PWA support to Safari. This means iOS users will soon be able to enjoy the more advanced capabilities in Office League too. Examples are installation, fullscreen mode and offline support.
The Office League team invites everyone with a foosball table nearby to sign up and create their league on: https://officeleague.rocks
If you don't have a table yet, now there is a good reason to get one!
The project made use of the following technologies
This project has shown us what modern web technology is capable of. Progressive Web Apps is a paradigm shift for both mobile and web. Enonic XP as an end-to-end platform handle all our back-end requirements without having to wrestle with 5-6 different systems.
Thomas Sigdestad
Office League Manager
Enonic
Don't take our word for it. Take it straight from the source—the real, flesh-and-blood customers themselves. Be inspired by their many cool projects on the Enonic platform.
The Norwegian Labor and Welfare Administration used Enonic and Next.js to migrate their massive site to a modern, headless architecture. Without compromising the editor experience.
Learn how the Norwegian Building Authority (DiBK) migrated from Optimizely to Enonic in this detailed case study.
How Enonic and a multinational organization with multiple offices and languages in several countries solved the riddle of localization.