using ibm mobile data for bluemix cloud service with an angularjs web app
DESCRIPTION
Bluemix is IBM's open cloud platform. More importantly, it's an app developer's best friend. It lets you focus on building outstanding web and mobile apps -- while it takes care of the infrastructure setup, provisioning, and hosting details for you. Learn how to quickly develop 5-star mobile apps using the Mobile Data service.TRANSCRIPT
© 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
© 2014 IBM Corporation4
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.
IBM Mobile Web for Bluemix – Fast Path
© 2014 IBM Corporation5
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
IBM Mobile Web for Bluemix – Fast Path
© 2014 IBM Corporation6
Update/Edit the Node.js server-side code
Edit public\bluelist.json …
IBM Mobile Web for Bluemix – Fast Path
© 2014 IBM Corporation7
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:
IBM Mobile Web for Bluemix – Fast Path
© 2014 IBM Corporation8
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/
IBM Mobile Web for Bluemix – Fast Path
© 2014 IBM Corporation9
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
IBM Mobile Web for Bluemix – Fast Path
© 2014 IBM Corporation10
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
IBM Mobile Web for Bluemix – Fast Path
© 2014 IBM Corporation11
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”
IBM Mobile Web for Bluemix – Fast Path