Chapter 5 - Publish Your Ionic App

In the last chapter, we learned how to add navigation/routing to our application. In this chapter, we will learn how to publish our Ionic App as web App, Android App and IOS App.

1. Publish Progressive Web App

a. Set up PWA

To deploy as a Web App, the first thing to do is to set up our project as Progressive Web App (PWA). To do that, in project directory, run:

1
$ ng add @angular/pwa

Note: If command doesn’t work, try:

1
$ npm link @angular/cli

or

1
$ npm install -g @angular/cli

b. Deploy App

We will use Firebase to deploy. First, you will need to create a project in Firebase.

Then, install Firebase:

1
$ npm install -g firebase-tools

After installation, log in using:

1
$ firebase login

Then initial firebase in project directory:

1
$ firebase init

Then it will ask you some questions:

  • “Which Firebase CLI features do you want to set up for this folder?”
    Select “Hosting: Configure and deploy Firebase Hosting sites.”

  • “Select a default Firebase project for this directory:” Select the project name you just created in Firebase.

  • “What do you want to use as your public directory?” Enter “www”.

  • Configure as a single-page app (rewrite all urls to /index.html)?” Enter “Y”.

  • “File www/index.html already exists. Overwrite?” Enter “N”.

Next, build the App using:

1
$ ionic build --prod

Finally, we can deploy the App using:

1
firebase deploy

After it is done, you should be able to access the App using the url for the firebase project.

2. Publish Android App

Coming soon

3. Publish IOS App

Coming soon