This will walk you through the steps to install the TodoLite-Phonegap sample app that uses Couchbase Lite Android. After you’re finished, you’ll end up with this app.

Install Homebrew

• Install homebrew

Install Android Studio

• Install Android Studio 1.0

• Setup an AVD + emulator — in my case I’m using the Genymotion emulator, with a Google Nexus 4 – 4.4.4 API 19

• At this point you should verify your setup by deploying TodoLite-Android to your emulator

Install Phonegap

Install Node.js

Phonegap is installed with the Node Package Manager (npm), so we need to get Node.js first.

1

brew install node

Install Phonegap

1

$ sudo npm install -g phonegap

You should see this output

Check your version with:

1
2

$ phonegap -v
4.1.2-0.22.9

Install Ant

1

$ brew install ant

Check your Ant version with:

1
2

$ ant -version
Apache Ant(TM) version 1.9.4 compiled on April 29 2014

Note: according to Stack Overflow you may have to install XCode and the Command Line Tools for this to work

Create new Phonegap App

1

$ phonegap create todo-lite com.couchbase.TodoLite TodoLite

You should see the following output:

Creating a new cordova project with name "TodoLite" and id "com.couchbase.TodoLite" at location "/Users/tleyden/Development/todo-lite"
Using custom www assets from https://github.com/phonegap/phonegap-app-hello-world/archive/master.tar.gz
Downloading com.phonegap.hello-world library for www...
Download complete

cd into the newly created directory:

1

$ cd todo-lite

Add the Couchbase Lite plugin

1

$ phonegap local plugin add https://github.com/couchbaselabs/Couchbase-Lite-PhoneGap-Plugin.git

You should see the following output:

[warning] The command `phonegap local <command>` has been DEPRECATED.
[warning] The command has been delegated to `phonegap <command>`.
[warning] The command `phonegap local <command>` will soon be removed.
Fetching plugin "https://github.com/couchbaselabs/Couchbase-Lite-PhoneGap-Plugin.git" via git clone

Add additional plugins required by TodoLite-Phonegap

1
2
3

$ phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git
$ phonegap local plugin add https://github.com/apache/cordova-plugin-inappbrowser.git 
$ phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-network-information.git

Clone the example app source code

1
2

$ rm -rf www
$ git clone https://github.com/couchbaselabs/TodoLite-PhoneGap.git www

Verify ANDROID_HOME environment variable

If you don’t already have it set, you will need to set your ANDROID_HOME environment variable:

1
2

$ export ANDROID_HOME="/Applications/Android Studio.app/sdk"
$ export PATH=$PATH:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools

Run app

1

$ phonegap run android

You should see the following output:

[phonegap] executing 'cordova platform add android'...
[phonegap] completed 'cordova platform add android'
[phonegap] executing 'cordova run android'...
[phonegap] completed 'cordova run android'

Verify app

TodoLite-Phonegap should launch on the emulator and look like this:

Facebook login

Hit the happy face in the top right, and it will prompt you to login via Facebook.

View data

After logging in, it will sync any data for your user stored on the Couchbase Mobile demo cluster.

For example, if you’ve previously used TodoLite-iOS or TodoLite-Android, your data should appear here.

Test Sync via single device

• Login with Facebook as described above
• Add a new Todo List
• Add an item to your Todo List
• Uninstall the app
• Re-install the app by running phonegap run android again
• Login with Facebook
• Your Todo List and item added above should now appear

Test Sync via 2 apps

• Install TodoLite-Android
• Login with Facebook
• Add / edit / delete items on TodoLite-Android
• Verify the changes appear in TodoLite-Phonegap

Note: you could also setup two emulators and run the apps separately

Appendix A: using a more recent build of the Phonegap Plugin

Reset state

1
2

$ cd .. 
$ rm -rf todo-lite

Create another phonegap app

1
2

$ phonegap create todo-lite com.couchbase.TodoLite TodoLite
$ cd todo-lite

Download zip file

1
2
3

$ mkdir Couchbase-Lite-PhoneGap-Plugin && cd Couchbase-Lite-PhoneGap-Plugin
$ wget http://cbfs-ext.hq.couchbase.com/builds/Couchbase-Lite-PhoneGap-Plugin_1.0.4-41.zip
$ unzip Couchbase-Lite-PhoneGap-Plugin_1.0.4-41.zip

Add local plugin

1

$ phonegap local plugin add Couchbase-Lite-PhoneGap-Plugin

You should see output:

[warning] The command phonegap local <command> has been DEPRECATED. [warning] The command has been delegated to phonegap <command>. [warning] The command phonegap local <command> will soon be removed.

Now just follow the rest of the steps above ..

References

• http://developer.couchbase.com/mobile/get-started/get-started-mobile/phonegap/prepare/index.html