Guide How to Install Ionic Framework on Windows for Beginners

Richards
By -
0
Guide How to Install Ionic Framework on Windows for Beginners

For those of you who are mobile application developers, then you are no stranger to the Ionic Framework, right? Ionic is a framework that we can use to build a hybrid mobile application with the help of CSS, HTML 5 and Angular JS.

The engines used by the Ionic Framework are NodeJS SASS and AngularJS. Ionic is also equipped with various CSS components, for example, such as grids, lists, forms, buttons, tabs and so on.

Therefore, Ionis is a web technology that we can use to build a mobile application. Because the technology is a hybrid, we can create the application at once, but we can release it on more than one platform, which is often called cross platform.

How to Install Ionic Framework on Windows


The advantages of this Ionic framework are that it can shorten our time in developing applications. That's because Ionic is a hybrid, where we only need to make it once and the application can be built on various devices at once.

Ionic is also a framework that we can get for free and very free for us to use for commercial or personal purposes.

One thing you have to remember is that Ionic is a framework only. If you want to make it an iOS or Android application, you still have to use phonegap or android studio. If you want to install the Ionic framework, then you must meet several conditions first, namely you must first install the tools below:
  • Js nodes
  • JDK
  • Apache Ant
  • Android SDK

If you don't install some of the tools above, there will be an error when coding. If so, then you can follow the method below to install the Ionic framework on Windows.

1. If you have installed some of these tools, you must open the Command Prompt application as an Administrator. Here we have to check whether the node js has been entered into the environment path or not. Type the command node -v. Then click Enter, if the display appears as shown below, then that is a sign that our node js has been entered into the environment path.

click Enter

2. If it does not appear as in the previous image, it means that your node js has not been entered into the environment path. To enter it into the environment path, open the Control Panel. Then click the User Accounts menu.

3. Then click the User Accounts menu again.

4. Then click the Change my environment variables menu.

5. Then the Environment Variables window will appear. Click on the Path variable and click the Edit menu.

Edit menu

6. Now, enter the address of the npm directory on your computer. Then click OK.

7. Then also enter the environment path for the JDK or Java. Create a new variable with the name JAVA_HOME and enter the JDK directory address in the Variable value section. Then click OK. Then enter the directory address of the Java bin folder in the Path section.

Path section.


8. Do the same thing for apache-ant by adding the path to the bin file directory location in the path variable. And for the android SDK, you must add a new variable with the name ANDROID_HOME and in the variable value, enter the android SDK file directory address.

directory address

9. Now, type the command npm -v and click Enter. Then a screen like the one in the image below will appear.

npm -v

10. Now you can install cordova first. Type the command npm install -g cordova. Then click Enter. Wait a few moments until the entire package is successfully downloaded.

npm install -g cordova

11. Check Cordova by typing the command cordova -v. If it looks like in the picture, that's a sign that cordova has been successfully installed.

has been successfully installed


12. Then install ionic by typing the command npm install -g ionic. Wait a few moments until the process is complete.

complete.

13. Then type the ionic command to see if the installation process went smoothly. If it appears a display like in the image below. That means the ionic framework is installed perfectly.

installed perfectly.


That's the article that explains how to install the Ionic framework on Windows. Hopefully this article can be useful for you.
Tags:

Post a Comment

0Comments

Post a Comment (0)

#buttons=(Ok, Go it!) #days=(20)

Our website uses cookies to enhance your experience. Learn more
Ok, Go it!