Following are some simple steps in order to connect our static Web Page with Firebase.
Step by Step Implementation:
Step 1: Firstly, We are going to create a project on Firebase to connect our static web page. Visit the Firebase page for configuring your project. Visit the website and click the On Add Project button as shown below.
Step 2: Give a Name to your project and click on the Continue button.
Step 3: Now click on the Continue button.
Step 4: Now choose Default Account For Firebase and click on the Create Project button.
Step 5: Now your project is created and you are now good to go.
Step 6: Now click on the 3rd icon that’s the Web button(</>).
Step 7: Give a nickname to your web project and click on the Register App button.
Step 8: Now you will see the configuration of your App like this. Copy this code somewhere as we will use it later.
Step 9: Click on the Realtime Database as shown below.
Step 10: Now click on the Create Database button.
Step 11: Now click on the Test Mode and then click on the Enable button.
Step 12: Activate Firebase Storage. Click on Storage button in the left and the click on Get Started.
After that this box will pop up . Click on Next.
Then Click on Done.
Now Create an HTML file and copy the script code which you copied in Step 8. The following file is just a sample for you to understand how to configure your project.
Entering some sample values of Name and Email address in the given form as shown below.
After clicking the Submit button, the data is getting stored in the real-time database as shown below.