Do I still need Firebase Config if my website will be hosted on Firebase's own platform?

Is it necessary to explicitly initialize a Firebase hosted website if there are no plans to start another project?

// Initialize default app
// Retrieve your own options values by adding a web app on
// https://console.firebase.google.com
firebase.initializeApp({
  apiKey: "AIza....",                             // Auth / General Use
  appId: "1:27992087142:web:ce....",              // General Use
  projectId: "my-firebase-project",               // General Use
  authDomain: "YOUR_APP.firebaseapp.com",         // Auth with popup/redirect
  databaseURL: "https://YOUR_APP.firebaseio.com", // Realtime Database
  storageBucket: "YOUR_APP.appspot.com",          // Storage
  messagingSenderId: "123456789",                 // Cloud Messaging
  me

asurementId: "G-12345"                        // Analytics
});


if (!firebase.apps.length)
  firebase.initializeApp(firebaseConfig);

https://firebase.google.com/docs/reference/js/v8/firebase#initializeapp

Currently using version 8

 <!-- Add Firebase products that you want to use -->
  <script src="/__/firebase/8.1.1/firebase-auth.js"></script>
  <script src="/__/firebase/8.1.1/firebase-firestore.js"></script>
  <script src="/__/firebase/8.1.1/firebase-storage.js"></script>

Answer №1

When hosting a web application that utilizes Firebase services such as databases, cloud storage, and authentication, it is essential to initialize the app as demonstrated in the query. This applies whether the web app is hosted on Firebase Hosting or any other platform.

Conversely, if the goal is to host a web application solely on Firebase Hosting without integrating with any Firebase service (for example, a website consisting of static HTML/CSS files or an app making API calls from another source), initializing the app in the app code is not necessary.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the process for generating a null result cursor upon publication?

Is it possible to return an empty cursor in Meteor? Meteor.publish('example', function(id) { check(id, Match.Maybe(String)) if (!this.userId) return [] }) Although I want the publication to return an empty result when the user is not lo ...

What could be causing replace() to malfunction in Node.js?

I am dealing with some data in Node.js and I am trying to replace the ampersands with their escape key. Below is the code snippet I am using: let newValue = data; for (label in labelData.data) { let key = "Label " + label; newValue = newValue.rep ...

What is the process for inserting a intricate new item into a JavaScript array?

In my Node.js/Express web app, I am working with a JavaScript data structure that looks like this: var users = [ { username: 'x', password: 'secret', email: '<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-c ...

The parsing of source maps fails due to issues with the .htaccess file

After analyzing the web page, I found that the .htaccess file contains the following code: RewriteEngine On RewriteBase / Options -MultiViews DirectorySlash Off # skip POST requests RewriteCond %{REQUEST_METHOD} POST RewriteRule ^ - [L] RewriteCond %{R ...

Trigger the component method in vue.js upon loading

Hello, I am still learning Vue.js and I am facing a challenge that seems simple but I am struggling to solve it. My goal is to make one of the component's methods execute every time it is loaded into the DOM. I have tried using v-on:load but it doesn& ...

What is the best way to utilize the history prop in conjunction with other props?

I am currently using react-router-dom along with react. My goal is to include additional props along with the history prop import React from 'react'; function MyComponent({ history }) { function redirect() { history.push('/path&ap ...

Bar Chart Data Label Problem with HighCharts

My goal is to have the label positioned outside the bar stack. I attempted to achieve this using the code below, but it seems to be inconsistent in its results. dataLabels: { enabled: true, color: '#333', ...

Adjusting the selection in the Dropdown Box

I've been attempting to assign a value to the select box as shown below: <dx-select-box [items]="reportingProject" id="ReportingProj" [text]="reportingProject" [readOnly]="true" > ...

I'm experimenting with incorporating images into a card component using the map function in JavaScript. All aspects of the card are functioning properly except for the image

import React from 'react' import Card from '@material-ui/core/Card'import CardMedia from '@material-ui/core/CardMedia'; import CardContent from '@material-ui/core/CardContent'; import {makeStyles} from '@materia ...

Enhancing AngularJS functionality through the integration of jQuery within a TypeScript module

As I try to integrate TypeScript into my codebase, a challenge arises. It seems that when loading jQuery and AngularJS in sequence, AngularJS can inherit functionalities from jQuery. However, when locally importing them in a module, AngularJS fails to exte ...

How can one efficiently update numerous data properties in a Vue.js application?

My information is as follows: data() { return { monday_start: '', monday_end: '', tuesday_start: '', tuesday_end: '', wednesday_start: '', ...

Switch from using getElementById to useRef in React components

There is a requirement to update a functional component that currently uses getElementById to instead utilize the useRef hook. The original code snippet is as follows: import React, { useState, useEffect, useRef } from 'react'; import { createPo ...

A guide on breaking down the ID passed from the backend into three segments using React JS

I pulled the data from the backend in this manner. https://i.stack.imgur.com/vMzRL.png However, I now require splitting this ID into three separate parts as shown here. https://i.stack.imgur.com/iy7ED.png Is there a way to achieve this using react? Bel ...

The concept of undefined functions and the use of dependency injection may not always align

Recently starting with AngularJs, I am honing my skills by developing a single page Todo Application. However, I have encountered an issue while trying to load a localStorage factory that I intend to use for this project. Currently, I am stuck on the error ...

What is the best way to incorporate my Switch component into my Table component as a distinct column, while also maintaining separate states for each component?

My journey into learning React.js has been exciting so far. However, I am facing some confusion when it comes to stateful components. Currently, I am utilizing Bootstrap tables for creating a table and successfully fetching data using GET requests. Additio ...

Encountering an error when attempting to generate a production build after running the npm install command with the

After adding the brotli-webpack-plugin as a devDependency, I encountered an issue when attempting to generate a production build using npm run build (which internally runs next build). The error message displayed was: Error: Cannot find module 'bro ...

Issue with JQuery's click and submit events not triggering, but change event is working fine

My webpage has a dynamic DOM that includes add and save buttons to interact with elements. Each row also has a remove option for deletion. When a user logs in, the controller redirects them to their homepage in the codeigniter PHP framework. This controlle ...

Is there a way to simulate pressing a keyboard button using jQuery?

Below is the code snippet: $("input").on({ keydown: function(ev) { if (ev.which === 27){ // esc button backspace_emolator(); } else if (ev.which === 8){ // backspace button console.log('backspace button ...

Retrieving properties from a selector's output function

My situation is similar to the scenario described in the accessing react props in selectors documentation. However, in my case, let's assume that the visibilityFilter is coming from the props. Is there a way to achieve something like the following? e ...

How can I collect various values from input fields that are within a foreach loop using jQuery?

<script> $("#submit").click(function(e){ e.preventDefault(); subjectID = $("#subjectID").val(); subject = $("#subject_"+subjectID).val(); subject_code = $("#subject_code_"+subjectID).val(); internal_marks = ...