I am excited to write about this topic. I felt I could build an android mobile app solution that would make people connect to the 2018 World Cup activities with both online and offline functionalities. Then the idea of building this app came up.
I used Jquery Mobile to sort the sliding tab on the left. Jquery is a good tool to integrate some cool effects on mobile apps. There are better libraries for building more better Apps UI, such as React.JS, Vue.js and so on. A starter could learn Jquery mobile as it motivates one to understand programming more clearer. There are free lessons here https://www.quanzhanketang.com/jquerymobile/default.html on Jquery Mobile
I used firebase to call the offline and online functions. When the app is online, it connects to the firebase database and loads the news update and image in realtime. If it is offline. It informs the user. If you want t learn more on firebase check https://www.firebase.com
This one of the most powerful programming languages in the present time. The app is developed from beginning to the end in JS. You could learn JS here as a starter https://www.quanzhanketang.com/js/default.html
After my web app was fully developed and tested fine on google chrome, I used phone gap to convert to .apk for the android users, Phone can also convert your cross platform HTML5,CSS and JS app into iphone apps ,ipad apps and windows phone apps. You may want to check this out here phonegap.com.
You may install the finished App here https://play.google.com/store/apps/details?id=com.terahertztechnology.FifaWorldCupRussia2018
You could adopt this concept to build more events apps that require realtime update. Reply below if you need some assiatnce with your codes. Best of luck!