Skip to content

Demo of Ionic App enhanced with MobileFirst Platform Foundation 8.0

License

Notifications You must be signed in to change notification settings

csantanapr/mfp8-ionic-demo

Repository files navigation

##Ionic + MobileFirst Platform Foundation 8.0 (MFP8)

TLDR; Demo Video:

Ionic + MFPF8 Video click to play

Setup a MobileFirst Platform Foundation 8 server

  • The easiest way to get a server running is using IBM Bluemix, there is a Free tier you can use
  • Go to the IBM Bluemix Catalog and create a Mobile Foundation Service

Install Tools

  • Setup the Command Lines Tools:
$ npm install -g mfpdev-cli  [email protected] cordova gulp-cli bower ios-deploy
$ android --help
$ adb version
$ javac -version (1.7+)
$ xcodebuild --help

How to use the sample code

  • Use Cordova CLI Template to download
  • Use a unique App ID, App Name, App Path cordova create PATH ID NAME --template TEMPLATE
  • App unique App ID is very important for Push Notifications setup
$ cordova create mfp8-app com.example.myapp Demo  --template https://github.com/csantanapr/mfp8-ionic-demo.git
  • Change directory and npm install
$ cd mfp8-app/
$ npm install
$ rm -rf .git/

or in one single command (Linux, Mac)

$ APP=mfp8-app; cordova create ${APP} com.example.myapp Demo --template https://github.com/csantanapr/mfp8-ionic-demo.git && cd ${APP} && npm install && rm -rf .git/

How to use the Ionic CLI

  • Use ionic cli to add additional platforms and optional plugins
  • Sample App already defines in config.xml most of the plugins from the demo, they get installed when you add the platform
$ ionic platform add ios@latest
$ ionic platform add android@latest

Note : If having problems with Android check platforms/android/AndroidManifest.xml that the <application> elements contains the attribute android:name="com.ibm.MFPApplication" if not present add the attribute

  • Use ionic cli to emulate and run
$ ionic emulate ios --livereload
$ ionic run  android --livereload

Ignore if the emulate prints something about missing ios-sim, Latest [email protected] includes ios-sim

  • Use ionic cli for other cordova actions
$ ionic prepare
$ ionic build

How to use the MFPDev CLI

  • Get help documentation for any MFPDev CLI command
$ mfpdev help [<command>]
$ mfpdev help
$ mfpdev help app preview
$ mfpdev help app config
...
  • Add a server profile bluemix for a remote server using the real values from IBM Bluemix
$ mfpdev server add bluemix --url http://mobilefoundation-2u-server.mybluemix.net:80 --login admin --password ***** --setdefault
  • If you have a mfp server running on localhost verify with the CLI
$ mfpdev server info
  • Register the mobile App with a server
$ mfpdev app register local
$ mfpdev app register bluemix
  • Switch back and forth the default server for the App
$ mfpdev app config server local 
$ mfpdev app config server bluemix
  • Always propagate changes for mfp configuration from config.xml after register or config
$ ionic prepare 
  • Live-Reload Preview using MobileFirst Browser Simulator (Cordova Emulation) or Simple Browser
$ mfpdev app preview
$ mfpdev app preview ios
$ mfpdev app preview ios android
  • Pull down the App configuration from the local server and Push it up to the remote server
$ mfpdev app pull local
$ mfpdev app push bluemix
  • To update web resources for after releasing the App to the App Store or corporate environment
$ mfpdev app webupdate bluemix

License

Apache 2.0

About

Demo of Ionic App enhanced with MobileFirst Platform Foundation 8.0

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published