Some background

I live in a shared flat for some years now, and as some of you might already know from their own experience, doing laundry can become a problem once in a while. Sometimes you really need some clean shirts, but one of your flatmates already started the laundry-machine. You could wait the two hours until its finished, but then the laundry needs to sit a day or two on the laundry rack to properly dry, so you have to wait two days until you can wash your shirts, but then there is the next person, who really needs to do laundry.

The obvious solution would be to talk to each other and to do laundry together, so nobody has to wear the same underpants 3 times in a row, but as it turns out, it is annoying to communicate about a trivial thing like laundry everyday, especially if not everybody is at home. So why not use an app, that everybody can alway access to plan laundry together?

The use cases

In our flat we already had a similar app in place for some time, but it was lacking some important features, so I decided to write a shiny new app, that would satisfy all our needs. With our old app, one could already:

  • Plan laundry with a specific clothes-color, temperature and date.
  • Participate in a planned laundry.
  • Indicate that your clothes are in the machine.
  • Mark laundry as finished.

It was missing however:

  • Accessibility outside of our network (you could only plan laundry if you were home anyway).
  • Mark the machine as full.
  • Get notifications when a new laundry got planned.

The stack

As I am a Vue developer, I decided to write the app with Vue as a frontend and Firebase as backend. I used Vuex for state management and Vuexfire to keep the data in the frontend in sync with the data in the database. The UI-Component library Vuetify provided a solid interface once again. This time I also used the PWA-quickstarter provided by the Vue-CLI. PWA is short for Progressive Web App, meaning not only the interface is compatible with mobile devices, but also the app inherits App-like properties on smartphones. As it turns out, this is quite handy, as even though the app itself lives in the browser and can be accessed via internet such as a usual website, a user can install it on his smartphone, the app works in an offline environment (obviously you can just view the data, that was last available) and the user receives notifications like from a native app.

Conclusion

It was really fun to develop this app, because I got the opportunity to use some new libraries and become familiar with how they work, while the end-product was a ready-to-use app that is in daily use for some time now in our flat and makes our live a lot easier.

Check out the code on GitHub.