Mealwrm Mobile

Hero banner image

Description

Mealwrm mobile is a mobile port of the Mealwrm web application. It's available for both iOS and Android.

Background

Our usage of Mealwrm usually involves meal planning on a laptop via the web application. Once we've planned, we generally move onto the grocery shopping phase, since we can't1 bring a laptop to the grocery store, we use our phones to shop. The mobile view of the web app's not bad, but I thought it'd be an interesting exercise to try to build a mobile port of the app for a more seamless experience.

Engineering

The web application is built in React and I'd also just helped build out the Osmosis mobile app in React Native, so React Native seemed the obvious choice. The mobile app interfaces with the same backend as the web application, so building the mobile experience actually ended up being relatively straightforward. It's also now housed in the same monorepo as the web application, so some code can even be shared between the two applications. Admittedly, the mobile app could use some love. It works, but not quite as smoothly as the web application, as my QA team2 likes to remind me. Some future work that I've thought about is bringing OCR capabilities to scan and extract recipes from physical recipe books.

Stack

React Native is the primary framework used for the mobile app. For styles it uses a React Native port of Rebass.

Made with 🥒 by T. 2024