Grocery Listr App

Grocery Listr is an iOS app for managing different kinds of lists with bells and whistles.

  • What is Grocery Listr?
  • Screenshots
  • Server-Side

Grocery Listr is your ONE app for lists. It is a convenient way to organize grocery lists and shopping lists. Create multiple lists, automatically group items into categories, and share your lists with friends and family. Save your favorite recipes and use them to create lists. More details about the app at and you can get the app from iTunes Store .


  • Smart Lists
  • Shared Lists
  • Recipe Lists

SMART LISTS Start typing an item name and the app will suggest relevant grocery items. Choose items and the app will automatically add correct category and units. Sort items by category or drag items to reorder. Make copies of a list and manage multiple lists. The autocomplete functionality for items is implemented using Levenshtein edit distance algorithm to allow for super fast rendering. The app builds up knowledge for items as user adds items to lists and this allows for personalized suggestions in autocomplete feature.

SHARED LISTS Share your lists with friends and family and collaboratively work on lists. Add items, cross off items, see updates in real-time, and get instant change notifications. The user identity is verified using Facebook OAuth and the server maintains a sharing graph between users. This allows for seamless N-directional sharing of lists. The app makes use of APN notifications to inform the user of list updates as they are changed in real-time by other users.

RECIPE LISTS Grocery Listr App allows you to create recipes in addition to shopping lists or grocery lists. A recipe is a special kind of list that gets included in the smart search invoked when you enter grocery items to any list. Add a recipe to a grocery list, and the correct quantity/amount of recipe ingredients will be added to your list. The app comes loaded with default recipes, make any list a recipe by turning ON recipe slider.

Grocery Listr App

The server side is running on Nginx, Node.js, Express.js and MySQL. Use the following instructions for setting up this stack on VPS. This was my first foray into a complete Node.js server, the MBaaS for other iOS apps has been using PHP stack. Really like Node.js and JavaScript syntax for sure makes it easier to digest given I don’t use PHP in my daily life. The ‘context passing’ and callback style did take sometime to get used to and there’s always the standard code organization pattern/template that you want to arrive at. I went with winston for logging events and wrapped it in a base logger module. There is a convenient npm apn module for sending Apple Push Notifications that made it super easy to send notifications. Express.js was straight forward to setup and provides robust support for implementing REST APIs needed for the iOS device. The Gulp build for the project took some time to setup especially to ensure I moved all variables to config files (dev environment or production environment) and then allow for the usual concatenation/minification, linting and packaging.

// *************************************
//   Gulpfile
// *************************************
// Available Tasks:
//   `gulp`
//   `gulp build`
//   `gulp package`
//   `gulp deploy`
//   `gulp watch`
//   `gulp report:lint`
//   `gulp clean`
//   `gulp lint:js`
//   `gulp copy:files`
//   `gulp compile:sass`
//   `gulp minify:js`
// *************************************