Ionic Framework Hello Word Tutorial

This tutorial will guide you through the process of installing and starting a new Ionic project.

Install Node.js

Download and install the latest version from the Node.js website.

Install Cordova and Ionic

This will install Apache Cordova and Ionic framework.

Cordova is a mobile application development framework. It enables programmers to build mobile applications using HTML5, CSS3 and Javascript.

Ionic is built on Cordova and is more focused on UI, offering the ease of coding one application, and deploy on all the mobile platforms.

Create a new app

This command will create a new folder and project TutorialApp, using the specified starter blank and provide all the dependencies.

Starters are project templates. Other  starters are available, like tabs or tutorial.

See the list of Ionic starter templates.

Then, you will be prompted a couple of questions, regarding project configuration.

Say y if you intend to build apps for Android and iOS. Say N if you don’t intend, and you are still free to add Cordova later.

Answer Yes, only if you already have a Pro account. Again, you can always link your project with the Pro account later.

Run the app

First, go to your app’s folder

This is a good habit to run the npm install. This will check for new dependencies and download them.

Then run the serve command

This will build and run the project. It is accessible via the browser on http://localhost:8100

If everything went OK, the result should look like this :

If you want to do more, browse the section.

Xavier Langlat

Xavier is a Freelance Innovation Solutions Architect and Technical Advisor. He has been working for 10 years in software development (Java, JEE, JavaScript, Angular, Node JS, React), and has solid experience as a Tech Lead and Technical Architect in different company sizes (Startup, SME, Large Enterprise), and in different sectors (Insurance, Risk Insurance, Transportation, Energy Management, Mobile Operator)