Using IBM Mobile Data for Bluemix Cloud Service With An AngularJS Web App

© 2009 IBM Corporation

Using IBM Mobile Data for Bluemix cloud service with an AngularJS web app

Susan Rizzo – IBM Mobile Cloud

14 November 2014

© 2014 IBM Corporation2

A fast path to setup of the BlueList Mobile Web sample

This presentation was created to show you how to quickly create & configure the IBM BlueMix Mobile Sample “BlueList Mobile Data Web” using Android Studio.

What you'll need to get started!

– Bluemix account ( https://ace.ng.bluemix.net/ )

– Git client (pick one of the many git clients available)• You'll need this to download (“git clone”) the code

– NodeJS Runtime ( http://nodejs.org/ )• Follow the installation instructions provided

– Cloud Foundry ( http://docs.cloudfoundry.org/devguide/installcf/ )• Install the cf Command Line Interface (CLI)

IBM Mobile Web for Bluemix – Fast Path

https://ace.ng.bluemix.net/

http://nodejs.org/

http://docs.cloudfoundry.org/devguide/installcf/


While you're here … save the BlueList App values needed later !

Go to the DASHBOARD

Click on your App ( my app is named “rizBlueListWeb” )

Open the MOBILE OPTIONS twistie …

Save your Route, App ID and App Secret …

* You will need your App values to configure the IBM Bluemix Node.js code.



GIT the mobilecloud bluelist-mobiledata code

From a Command Prompt, issue the following commands:– git clone https://hub.jazz.net/git/mobilecloud/bluelist-mobiledata– cd bluelist-mobiledata\bluelist-mobiledata-mobileweb

If you view the directory listing (dir), you will see the files shown below.– You will need to edit file: public\bluelist.json



Update/Edit the Node.js server-side code

Edit public\bluelist.json …



Use npm to build local copy of BlueList Mobile Web app From your Command Prompt, issue the following commands:

– Verify you have npm installed: npm –version– Install the server-side dependecies: npm install --production

• Installs dependencies listed in package.json file– Install the bower package manager: npm install -g bower– Install the client-side dependencies: bower install

• Installs dependencies listed in the bower.json file Once completed, you will have a node_modules directory like this:



Run the LOCAL copy of your BlueList Mobile Web app Start the local copy of your Mobile Web app: node app

Once the app starts, you can access the app using http://localhost:3000/


http://localhost:3000/


Use cf to “login” to Bluemix

From your Command Prompt– Verify cf CLI version 6+ installed: cf –version– Log in to Bluemix: cf login -a https://api.ng.bluemix.net


https://api.ng.bluemix.net/


Use cf to “push” the Node.js server-side code to Bluemix

Issue the cf push command: cf push <your_app_name> -p .Note: The node_modules directory does not need to be pushed, so the directory can be deleted prior to cf push



Run the Bluemix copy of your BlueList Mobile Web app

Open a browser and access the app using the applicationRoute– For example, my applicationRoute is “rizBlueListWeb.mybluemix.net”


Using IBM Mobile Data for Bluemix Cloud Service With An AngularJS Web App

Mobile

Transcript of Using IBM Mobile Data for Bluemix Cloud Service With An AngularJS Web App