Hi Folks, We are going to create a simple application that used to send HTTP POST request to Firebase.

 

First of all open cmd and install angular-cli using command

 

After installation of angular-cli, create your angular2 project using following Command

 

Now open cmd into your project directory and run command

 

Now open following url.

http://localhost:4200

and you will see the front page of your Application


Now open app folder and create Components folder.

Run Following command to create component

Here g is generate , is component, Components is folder name and form is component name

Now copy selector from form.component.ts and paste it into app.components.html

Open form.component.html and replace with following

so now I am going to include Twitter Bootstrap.

Install bootstrap by following command

If you wanna include bootstrap 3 then run following command

Now open angular-cli.json and inlcude bootstrap path into styles.

Restart your app
Now form is ready 🙂

 

SETUP Firebase

Open firebase.google.com then go to console and create project


After creating project click on it and then click on database.
we have to change rules to write and read the data.

Service
Create Services folder within app folder
open cmd and run following command

now open app.module.ts and import service

After importing service open http.service.ts

and update it with following code.

 

Now open Firebase and click on Database and copy endpoint and replace it into http.service.ts

Now open form.component.ts and replace with the following

Your application is ready. Now open http://localhost:4200

Enter title and content and submit it

open firebase to check your submitted data.

Thanks 🙂

 

You can download source from my GitHub Repository