Parse Mealtracker Starter App

Parse Mealtracker Starter App

Mealtracker app with Parse for login, signup and tracking meals and images.


Asim Hussain

Asim Hussain

Member since 2014


iOS, Android  
6 years ago
6 years ago
codecraft, parse, camera, authentication,


This is an example starter project used in the Ionic: From Web To Mobile course.

In this starter project we create a meal tracker application.

This application uses as a backend.

The starter app shows you how to signup and create a new user account with as well as how to login via

We’ll show you how to save data in the parse database as well as showing you how to store images.

We’ll show you how to query and show your meals in a list view as well as supporting features like infinite scroll and pull to refresh.

A step by step explanation of how to implement this application can be found in the Ionic: From Web To Mobile course (70% off with the link above).


  • Download and unzip into a folder.
  • Run the below command to create the project NOTE: We are using the —sass flag which tells ionic to start this project with sass enabled.

ionic start --sass <name-of-your-app> <path-to-local-folder>

  • Add the required cordova plugins

ionic plugin add cordova-plugin-media

  • Add the required bower packages

bower install ngCordova bower install angular-moment

bower install parse-angular-patch

bower install angular-messages

Setting up Parse

  • Create an account on and once logged in create a parse app.

  • Once you create an application on parse it will present to you a number of keys
  • In the app.js file find the Parse.initialize line and replace the keys with the keys from your app.

Parse.initialize(“[APPLICATION-ID]”, “[JAVASCRIPT-ID]”);


  • Edit the file under the main scss folder so it contains these variables and @imports.

$royal: #73C8A9;

$positive: #73C8A9;

$dark: #373B44;

$stable: #DEE1B6;

$assertive: #BD5532;

@import url(,700);

$font-family-base: ‘Domine’, serif;

$ionicons-font-path: “../lib/ionic/fonts” !default;

@import “www/lib/ionic/scss/ionic”;

@import “www/scss/form.scss”;

@import “www/scss/styles.scss”;