For our first project, we will make a dice-rolling app. We'll take it from a simple (and ugly) one-trick pony web page to a for-real progressive web application that we will package up for the Apple App Store and Google Play for 99¢.
A Dice-Rolling App? Really?
I have several reasons for choosing a dice-rolling app as the first project I'll walk through here. The first one is that I am really, really tired of to-do apps. Yes, they have all of the input, output, and UI elements needed for any web application, but MY GOD, they're so boring.
The second is that once you grasp the basics, you can go in many different directions depending on your interests. Want to make it so you're working with playing cards or Tarot cards? With a few logical and UI changes, that's an achievable goal. Want to make your app all graphical and flashy with animations or backgrounds? Go for it. How about having multiple users use the same "table" together in real-time? Statistics, analysis, visualizations – the humble dice-roller is an excellent place to start.
Finally, a cheap or freemium app like this won't replace your day job, but going from zero to seeing your work on the App Store is incredibly motivational. Take what you've learned and start from the top with your idea.