One of the challenges when starting a mobile app project is deciding what technology stack to use. Should the client app use iOS or Android native, mobile web, or a hybrid? Do the backend in Node, Ruby, or Java? Or skip the backend and use an Mobile Backend-as-a-Service?
To help avoid needing to answer all those on your own we are open sourcing the Heroku Mobile Template. This app provides a full-stack starting point for creating new hybrid mobile apps and deploying them to Heroku.
What’s in the box?
The template application implements a simple real-time mobile Quiz app called “Quiz Live”. It uses an AngularJS client-side application which runs on the phone, and a Node.js server side application to provide authentication, data storage, and notifications. Persistent data is stored in a Postgres database.
This app collects a curated set of libraries and patterns to give you a complete template for building a new mobile app:
- Ionic Framework This mobile UI component library lets you quickly build mobile app UIs that feel very natural on a phone, and work across both iOS and Android devices.
- AngularJS This single-page web app framework gives you the power and structure to create advanced apps that run great in mobile browsers with a minimum of code. Our entire sample app uses approximate 300 lines of Javascript for the client app.
- Apache Cordova You can test and deploy apps directly over the web, but the Cordova project makes it very easy to compile your HTML/JS assets into a native app which can be deployed through the Apple or Google app stores.
- Node Express The express framework for Node.js provides a flexible framework for implementing APIs and other server-side logic for your app. Using Javascript front-to-back enables developers to leverage their skills throughout the stack.
- SocketIO The gold standard for real-time communication makes it trivial to distribute state changes in real-time to users of your app. Our Quiz Live sample app shows how easily you can leverage Websockets to create super-engaging user experiences with your app, without getting into the complexities of mobile push notifications. (You can still add push notifications later.)
- BookshelfJS This ORM for Node enables you to easily store and retrieve JSON data very naturally in Postgres (https://www.heroku.com/postgres). The JSON data type in Postgres makes it easy to store JSON data without having to give up the power of SQL and a proven, scalable data store.
Getting started
Head over to Github and fork the repo https://github.com/heroku/mobile-template1. Now click the Heroku Button on the README to deploy your own copy of the template app.
To run the app locally you just need Postgres and Node.js installed on your machine.
Integrating with Force.com
To integrate with data and services from Salesforce, checkout the notes on Force.com integration from the template. The Quiz app includes an example showing how to create Lead records based on users that register for the Quiz.
If you are working in Ruby or another technology on the server, checkout this post detailing some other good packages for integration with Force.com.
Going further
Salesforce is bringing back the $1M hackathon this year, and the prizes will go to the best mobile apps built on the Heroku and Force.com platforms. We hope this app template can help everyone who is looking for an easy way to get started.
Obviously this template doesn’t do everything you might want to do in your app. If you need a different kind of front-end, have a look at the Ionic tutorials to learn about how to choose a different theme or layout for your UI.
For more device capabilities, checkout the growing registry of Cordova plugins that enable all sorts of functionality.
For push notifications there are a number of service providers in the Heroku Add-on marketplace.
If you’re ready to deploy to an app store, checkout the instructions for wrapping your app in a Cordova wrapper. Deploying to the Google Play store is fairly straightforward, but deploying through the Apple App Store still requires that you enroll with Apple’s developer program and follow their steps for App Store submission.
We recognize that this mobile template doesn’t work for every type of app. Many games or apps that heavily rely on device features will need to be written as native apps. But we’re confident that a growing class of world class apps can be built using this template. We are still improving this template, and we welcome your feedback. And we’d love to hear about the apps that you’ve built.