Ionic

Hybrid Apps mit Ionic und PhoneGap Builder

Links

http://ionicframework.com/getting-started/
https://www.youtube.com/watch?v=C-UwOWB9Io4&feature=youtu.be

Einleitung

Ionic basiert auf AngularJS, mit diesen Tools erstellen wir die Webapp, die dann mit PhoneGap Builder zu einer Hybrid App gebündelt wird.

AngularJS ist ein Framework zur WebApp Entwicklung mit hoher Performance. Ionic steuert viele Komponenten und in MobileApp übliche Bedienelemente bei.

Schnelle App mit Ionic

1. Install Ionic (s.o.)
2. Create App
3. Build and Test

Create

Verzeichnis erstellen z.B.

/myUserfolder/myApp
ionic start myApp tabs

Build and test

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

Projekt anlegen

Es gibt verschiedene Grundtemplates

• leer

$ ionic start myApp blank

• tab navigation

$ ionic start myApp tabs

• side navigation

$ ionic start myApp sidemenu

Quicktips für Projekte

• cd into your project:

 cd firstIonicAppOrAnotherName

• Setup this project to use Sass:

ionic setup sass

• Develop in the browser with live reload:

ionic serve

• Add a platform (ios or Android):

ionic platform add ios [android]

Note: iOS development requires OS X currently See the Android Platform Guide for full Android installation instructions: https://cordova.apache.org/docs/en/edge/guide_platforms_android_index.md.html

• Build your app:

ionic build <PLATFORM>

• Simulate your app:

ionic emulate <PLATFORM>

• Run your app on a device:

ionic run <PLATFORM>

• Package an app using Ionic package service:

ionic package <MODE> <PLATFORM>

• Invite anyone to preview and test your app

ionic share EMAIL

For more help use ionic --help or ionic docs Visit the Ionic docs: http://ionicframework.com/docs

View App http://view.ionic.io

Generate splash screens and icons with ionic resource http://ionicframework.com/blog/automating-icons-and-splash-screens/

Ionic Account

Create an ionic.io account to send Push Notifications and use the Ionic View app? (Y/n):