Experimental Mobile/Visualization/Cloud Monitoring App

I currently work for Rackspace, and this is not an endorsed project. However, one of the things I value about them is their support of open-source software.

Over the holidays, I wanted to learn about frontend, mobile, and asynchronous programming using Twitter Bootstrap, Jquery, Backbone.js, Node.js, Express.js, Underscore.js, Apache Cordova, PhoneGap, and D3.

The result is this little Mobile app that queries Rackspace Cloud Monitoring Metric data and then graphs it using D3. The code compiles down to iOS and Android, but also runs as a website with the help of a cross-domain proxy (included). It needs to be refactored, doc’d, and visually prettied up, but it works well.

-dave

Find me on LinkedIn

Check out my Blog

Follow me on Twitter @dcwangmit01

Screenshots

Installing Xmobile on an Android Device

You can install it by opening a browser on your device and navigating here:

• http://xmobile.davidwang.com/xmobile/xmobile.apk

Installing Xmobile on an iOS Device

I think it works because the iOS app runs well within the Xcode iOS Simulator (see Screenshots).

• I don't own an iOS device, and I haven't paid Apple for the right kind of developer access to create a private app store.

Running Xmobile from your Desktop Web Browser

Navigate here:

• http://xmobile.davidwang.com/

Serving Xmobile as a Web App on Linux

The software is completely client side, but a server is needed to initially serve the pages and provide a cross-domain reverse proxy.

• Create a 512mb Ubuntu 12.04 server on Rackspace. http://www.rackspace.com
• Login and install some packages sudo apt-get install git emacs23-nox nmap unzip ant
• Install node.js

  sudo apt-get install g++ curl libssl-dev apache2-utils git-core make
  wget http://nodejs.org/dist/v0.8.14/node-v0.8.14.tar.gz
  tar xzvf node-v0.8.14.tar.gz
  cd node-v0.8.14
  ./configure
  make
  sudo make install
  npm install js-yaml fs express async
  sudo npm -g install cordova
  

• Clone the Xmobile repository

  git clone ssh://dave@s.davidwang.com:2222/var/git/xmobile.git
  cd xmobile
  cd backend
  npm install
  

• Install the Android SDK

  mkdir ~/.devlib
  cd ~/.devlib
  wget http://dl.google.com/android/adt/adt-bundle-linux-x86_64.zip
  unzip adt-bundle-linux-x86_64.zip
  

• Edit the ~/.bash_profile

  emacs ~/.bash_profile
  //// File Contents
  export PATH=${PATH}:~/.devlib/adt-bundle-linux-x86_64/sdk/platform-tools:~/.devlib/adt-bundle-linux-x86_64/sdk/tools
  export PATH=${PATH}:/usr/local/share/npm/bin
  //// EOF
  source ~/.bash_profile
  

• Run the app for android: (default: 8000)

  cd xmobile
  sudo cordova platform add android
  cordova serve android
  

• Run the cross-domain reverse proxy server, which is necessary only for the website (default: 8443)

  cd xmobile/backend
  node server.js conf/config.yaml
  

License

MIT License: http://opensource.org/licenses/MIT