Create Angular 6 Application and Deploy on Firebase

Prerequisite to create Angular App

• Install the latest version of Node.js from here
• Install Visual Studio Code from here

Install Angular6 CLI

 Run the following command in a command prompt.

• npm i -g @angular/cli

Now execute the following command to start the web server.

• ng serve

Check website on local server using http://localhost:4200

Now Angular CLI will create our dist files after execute below command in terminal :

ng build --prod

Link and Deploy Angular App to Firebase

We need to first link the application with firebase then deploy

1. Open firebase console from here

2. Click on Add Project and create it.

3. Copy code from Add Firebase to your web app from Console

4. Follow below steps to link application

• Download the firebase tools

            npm install -g firebase-tools

• Login to Firebase using the firebase tools

          firebase login

• Link our local app to our Firebase app

           firebase init

the answers to the questions Firebase tools will ask are:

Are you ready to proceed? Yes

Which Firebase CLI features? Hosting (In the future, use whatever you need! Press space to select.)

Select a default Firebase project? Angular Hosting Test (Choose whatever app you created in the earlier steps)

What do you want to use as your public directory? dist (This is important! Angular creates the dist folder.)

Configure as a single-page app? No

Deploy 

1. Execute below command to create dist/ folder in our project 

    ng build --prod

2. Execute firebase deploy command

It will deploy our app to firebase now we can link to custom domain and can access it directly also.