Skip to main content

Step by Step Setup of Ionic Framework on Windows

Step 1: Install Node.Js

Go to www.nodejs.org and download 32 bit / 64 bit NodeJs  (Size Around : 5 MB)

image

Step 2: Install Ionic

run Node.js command prompt from windows menu and type following to install ionic

npm install ionic –g

image 

Step 3: Install Cordova

Now once you are done with ionic installation , install Cordova as follows by typing in Node.js command prompt:

npm install cordova –g

image

Step 4: Start New Ionic Project

Node.js command prompt go to your favorite directory where you want ionic project reside

type following:

ionic start <YourApplicationName> <Template>

for example:

ionic start HelloIonic blank

image

the ionic project will be created in the specified directory

image

the ionic project files located in www directory for changes

we will change the index.html file and take a look how it runs in browser

I have changed following text in index.html :

“Ionic Blank Master” to “Hello Ionic Starter”

we will see how it runs in the browser

Step 5: Running Ionic Application in Browser

in Node.Js command prompt locate the directory where ionic project got created

run following command to see application running in browser

ionic serve

 image

image

Step 5: Running Ionic Application in Google Chrome Canary Browser

just download and install Google chrome canary version to see mobile version of application running in browser

run google chrome canary version and press F12 to open developer tools and select Mobile Icon to see mobile version

image

Comments

  1. This is really helpful and informative, as this gave me more insight to create more ideas and solutions for my plan. Excellent and very cool idea and great content of different kinds of the valuable information's.
    Mobile App Development Company in Dubai
    Android App Development Company in Dubai
    Mobile App Development Company
    Mobile App Development Company in UAE

    ReplyDelete
  2. It’s really a nice and helpful piece of info. I’m happy that you shared this useful information with us. Please keep us informed like this. Thanks for sharing.

    best mobile app development company in lahore

    ReplyDelete
  3. Thanks for the post and effort! Please keep sharing more such blog. I have really like your blog and inspire me in many ways.
    ionic app development company

    ReplyDelete
  4. Thanks for your great blog. But you can also find something new for ionic framework app development that is easily available and can learn very partly. It is cost-efficient and reduces the need for maintenance too.

    ReplyDelete

Post a Comment

Popular posts from this blog

Running Ionic Application on Android Emulator on Windows

PREREQUISITES Make sure following prerequisites are mate before running ionic application on Android Emulator Latest Java Runtime Environment and JDK Installed Android SDK has been installed with necessary API version and platform tools Apache Ants Must be installed in order to run Ionic Application on Android Emulator (ant.apache.org/bindownload.cgi)   JAVA Config Installation Location: C:\Program Files\Java\jdk1.7.0.0_51 Add following System Variable JAVA_HOME ==> C:\Program Files\Java\jdk1.7.0.0_51 Android SDK Installation Location: D:\Android\android-sdk-windows Add following System Variables ANDROID_HOME  ==> D:\Android\android-sdk-windows Apache Ant Installation Location: D:\Apache\Tools\apache-ant Add following System Variable ANT_HOME ==> D:\Apache\Tools\apache-ant PATH Configurations Add following paths to PATH system variables ;%PATH%\tools;%ANT_HOME%\bin;%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tool   Step 1 : Try to run Ionic In Android Em