How to install Ionic 2 with Angular 2 + Typescript


Ionic 2 with Angular 2 + Typescript

Install Ionic 2 and Building Mobile App: With evolving technology, there are a lot of languages which had been come into existence for building applications. Many languages are there which are used to build mobile applications. Below are the steps to install Ionic 2 with Angular 2 framework based on Typescript.

What is Mobile Hybrid App?

Hybrid Mobile App is different from Mobile Native App. Hybrid App for the mobile is generally built with the front end development languages such as HTML, JavaScript, TypeScript and CSS. This is bind inside the native wrapper so as to enable it to install and settle on the android or IOS device. For developing hybrid app there is no need to learn and use the native app programming languages. Native Language includes Java, Objective-C, and Swift.

There are a lot of native wrappers available but the most common and the popular native wrapper present is Cordova or PhoneGap. As the mobile app starts, the front end development languages (Typescript, JavaScript, CSS, HTML) are loaded under the Cordova native wrapper. There are many plugins and features which are available inside the Cordova wrapper.

About Ionic 2

ionic 2, angular 2, ionic 2 tutorial, ionic add platform, install Ionic 2

Ionic is the framework to design the UI Framework. Ionic 2 is designed on the top of the Angular 2 which is other very popular framework. With the increase in trend of the Angular 2 framework in the front end developers, Ionic 2 is introduced which is designed from the scratch using the Angular 2 and Typescript.

Steps to Install Ionic 2 Framework:

  • Firstly install the NodeJS platform in order to proceed further.
  • In order to install and set up the Ionic SDK for the Ionic Beta: npm install -g ionic@beta
  • After the ionic beta installation, start the project with ionic start AppName – -v2.
  • If you do not have the typescript installed then run ionic start AppName – -v2 – -ts.
  • To check the information of ionic just type ionic.
  • Now to further proceed to enter into the AppName directory by running cd AppName command.
  • There are different categories under which you can create your template. Some templates are like Blank Template, Tab Menu Template, Side Menu Template and other.
  • Run the command ionic serve in order to run the app in the browser.

    ionic 2, angular 2, ionic 2 tutorial, ionic add platform, install Ionic 2
    Install Ionic 2
  • You can run ionic serve -l to run your app as the mobile device on the browser.

ionic 2, angular 2, ionic 2 tutorial, ionic add platform, install Ionic 2

  • The code which is to be modified is present inside the src folder. When you modify this code of ionic and save the code, it automatically gets built and compiled. You can notice the changes made in the device browser.
  • To run on Android run the command ionic run android or you can run ionic run $platform according to your requirements.

So this was all about the How to install Ionic 2 with Angular 2 + Typescript. We will discuss more on How to solve Arithmetic Coding example? Binary Arithmetic Coding in our next session. If you have any further information then you can share us by commenting in the comment box below. Stay tuned to us at EducationTimes.