Wednesday, February 04, 2015

Try Ionic framework hybrid app on Mac

Introduction


Ionic framework is a cross-platform HTML5 Javascript CSS framework for hybrid app.
It works with AngularJS and Cordova (PhoneGap).

Check the Ionic documents for details, you will find what it provides.
  • AngularJS: data binding, page routing...
  • AngularJS Extensions (the magic of UI components; View Controller pattern; Javascript Utilities )
  • Ionic Icons
  • CSS UI Components, which you can use Sass to customize.
  • HTML5 Input Type
  • CLI Command line tools - CLI FAQ
  • Demos and Examples - check the Kitchen Sink App with examples demonstrating most of Ionic's features.
  • App Template: iOS-like Tab View Controller template; Side menu template;
  • Community Forum where you can discuss the issues with Ionic.

http://situee.blogspot.com/2015/02/try-ionic-framework-hybrid-app-on-mac.html


Try it on MAC!

Follow the Get-Started guide.

Install Ionic. 

You may have to add sudo before the command if got permission deny.

$ npm install -g cordova ionic

Check if installed.


$ ionic

If you got
ionic: command not found  or  cordova: command not found
Please check your npm default bin path is correct and fix it.

First check if ionic is installed at path like /usr/local/lib/node_modules/ionic/bin/ionic. If it is there, you need to check the npm default global path.

Run command npm config get prefix to check the default path, it should be /usr/local. If it is not /usr/local, run command npm config set prefix /usr/local to set it. And then install again.
https://stackoverflow.com/a/28314759/111277

Create a new project with tabs template.


$ ionic start myApp tabs

Install iOS simulator support


$ npm install -g ios-sim

Run it on iOS simulator


$ cd myApp
$ ionic platform add ios
$ ionic build ios
$ ionic emulate ios


Oops! It look much like native iOS.






6 comments:

  1. This comment has been removed by the author.

    ReplyDelete
  2. Thank you. You have saved my project!


    www.wanasoko.com

    ReplyDelete

  3. "Amazing Post!
    I love it. Will come back again - taking your feeds also.
    Thanks."!!
    mobile development framework cross platform

    ReplyDelete
  4. I’m really amazed with your posting skills as well as with the layout on your blog site. Is this a paid style or did you modify it yourself? Either way keep up the pleasant quality writing, it is rare to see a great site such as this one these days.
    Mobile App Development Company in Dubai
    Android App Development Company in Dubai
    Mobile App Development Company
    Mobile App Development Company in UAE

    ReplyDelete
  5. The blog is likely to walk readers through the step-by-step process, showcasing the simplicity and versatility of Ionic for cross-platform app development.https://www.mobilezmarket.com/

    ReplyDelete