- This is a simple app that I'm using to learn the basic concepts of Ionic and to demonstrate how it could help us develop a cross-platform mobile app.
- The main purpose of the demo is to serve as a Proof-of-Concepts before we make a final decision to use Ionic.
- After cloning this repo:
-
Go to the main directory 'HybridAppDemo'
-
If you want to test on a broswer simply navigate to the 'www' directory and open the index.html file (Note: during development is best to stay in the browser to take advantage of the browser's debugging tools).
-
Since the platforms and plugins directories are included in .gitignore, you'll have to add them to the project. Note: currently there's no node_modules directory so for now you don't have to run
npm install
, but you might have to in the future. -
First create a directory called 'plugins' inside the root directory. This is required before we add any platforms because when we run the platforms command it'll look for that directory to create the platform config JSON file.
-
Now we can add the platforms. To add Android and iOS run the following command:
ionic platform add android ios
. This command creates each platform's directory where the projects for each individual platform live. -
To test on the iOS simulator simple type the following in the terminal:
ionic emulate ios
. This opens the iOS simulator and runs the app. This is assuming that you have Xcode SDK installed on your machine. -
Android requires a bit more of work, first (if you don't already have it) you need to download Android's SDK, be sure to download all tools listed on their page. Second, using Android's emulator is very fustrating, it's too slow and buggy. I found Genymotion, a tool that creates a virtual machine where you can add Android devices. It requires an account but it's free for a single user. IMPORTANT: in order to use Genymotion you'll need to install Virtualbox in order to create the virtual machine enviroment.
-
Once you have Android's SDK, Genymotion, and Virtualbox installed you can on an Android virtual machine by typing the following in the Terminal:
ionic run android
. Notice how we're usingrun
instead ofemulate
hence we're on a virtual machine and Ionic treats it as such. -
To run on an actual device, simple connect the device and run
ionic run ios
orionic run android
. For Android make sure you device is running on Android 4.x or above. -
To deploy to the App Stores or HockeyApp for instance, for iOS it's best to do it in Xcode like you would normally do. For Android I made a document included in this repo Android Publishing which has details on how to accomplish this.