How to setup ionic framework

Ionic framework is a great framework to start your hybrid mobile app development. By this time it is now stable and ready for production ready apps.

So it just follows very simple steps to start your development in ionic. You must need following thing before developing an app based on ionic framework.

  • 64-Bit Windows 7+, Mac OS X or Linux Ubuntu (For Building app for iOS, you need MAC Desktop or Laptop at-least)
  • NodeJS (32bit or 64bit depending on your OS). 64-Bit is preferred one.
  • JDK 1.7+ 64 Bit
  • Android SDK
  • iOS SDK
  • Ionic CLI

Key Notes about Android App

You can develop Android Apps in any OS starting from Windows 7, Windows 8.1 and Windows 10+, Mac OS X, Linux Ubuntu.

To Develop iOS Apps (iPhone and iPAD) you must need one Mac Desktop or Mac Laptop. But there are some services by using which you can generate a iOS App by uploading your source code to the service provider server (But this is not preferable).

To Develop Windows Mobile App (Windows Mobile 8.1 or Windows Mobile 10) you must need Windows Desktop with Windows Desktop 8.1 OS or Windows Desktop 10 OS 64 Bit.

Steps you should follow

  1. Download and install the nodeJS fromĀ . I would suggest you to install a 64-bit version of windows 7 / windows 8 / windows 10 / Mac OS 10.x. Because 64-bit can take advantage of more memory as compated to a 32-bit OS. MAC OS will be the perfect OS for mobile app development.
  2. After download nodeJS, then install it. Then open command prompt / Terminal windows, and type “node –version”. It should return some version of nodeJS. This ensures that node is installed correctly. Some times on some window system, nodeJS is not installed correctly, try to downgrade the nodeJS, i mean download some older versions of nodeJS and install it. Sometimes it is required to install .net framework 3.5 or 4.
  3. Then open command prompt / Terminal window and type following commands one after one and press enter.
  4. npm install -g ionic
  5. npm install -g cordova
  6. Install the JAVA JDK in your system and do the path setting.To test whether java is installed properly or not, just goto terminal and type “java” press enter, it should return something.
  7. Download Android SDK fromĀ installer_r24.3.4-windows.exe and install it. You might need to do the path settings for the Android SDK folders.
  8. Then open terminal window and type “android” press enter. Its should android SDK manager window, if this command is not working then you need to set path
  9. Let’s assume android is installed on “c:/android/”. Then you need to setup path of folders, do some google for it

Create a new Project using ionic framework

Open command prompt / terminal window and type following commands to create a new ionic app.

  1. ionic start projectName templateName
  2. ionic start demo sidemenu
  3. ionic serve

These 3 commands should work perfectly. This will open app in browser. As you know ionic app, we can test it on browsers.

Create android app using ionic framework

Now to test app on your android device, lets connect your phone with your desktop / laptop through USB cable. Then install the required drivers for your phone. After installing all the drivers, you should access your mobile device from your computer.

  1. ionic platform add android
  2. ionic build android
  3. ionic run android

It’s done. You should see the app running on your device.

All the issues during this process will be features in another article.

Ionic Rocks :)